0

I've got 4 types of a subtemplate that can appear in my parent template. Let's say these are different input types in a form. I get some data from the server and want to feed these templates (select input field with options) with the retrieved data.

I would use something like this:

<ng-include src="'./path/to/template/input/' + vm.data.type + '.html'"></ng-include>

But I want to use this template more times with different data for it. Like this: 

<select>
      <option ng-repeat="option in myOptionsData">{{option.text}}</option>
</select>

I kind of should be abled to call this piece of UI like a function with a parameter (myOptionsDatafrom above) for the data. How is this solved properly? I read about a new controller where the data will be passed by a service, but it seems very troublesome to me to create a service for each type of subtemplate. Am I missing something?

mrp
  • 689
  • 1
  • 8
  • 17

2 Answers2

0

It's kind of simple, you could use in your HTML something like :

<ng-include src="vm.resolveUrl(vm.data.type)">
</ng-include>

So you could do this in your controller :

$scope.resolveUrl = function(param) {
    return "./path/to/template/input/" + param + ".html"
}

The more properly way to solve this is the piece of code that is more easy to maintain and also the more readable. So let me know if this works for you!

Alfredo Zamudio
  • 408
  • 3
  • 12
  • No, it's not the problem. I want data inside my subtemplate. I edited my question with an example. – mrp Jun 20 '16 at 22:02
0

I found an answer in this post. The solution is to give ng-includethe ònload`attribute with the data like this: 

<ng-include src="'./path/to/template/input/' + vm.data.type + '.html'" onload="myOptionsData=vm.someData"></ng-include>

It works fine, I'd rather like to know whethere there is a better solution.

Community
  • 1
  • 1
mrp
  • 689
  • 1
  • 8
  • 17