-1

i'm storing a html string in a scope object and want to pass it to a variable

  $scope.template1 = "div ng-include="'/app.html'" </div>"

Then i want to pass this template1 to my bootstrap template option with the output of $scope.template1

 tour.start{
  template:$scope.template1// Here i'm looking the output with the content of app.html
  }

How can i compile template1 and pass the output?

rUI7999
  • 129
  • 1
  • 3
  • 20

1 Answers1

2

Simply use the $compile service:

$scope.template1 = $compile("div ng-include="'/app.html'" </div>")($scope);

This way, your template will contain your ng-include content (remember to add $compile to your dependencies).

By the way, I recommend that you use $templateCache service to store your static content in javascript, in order to have a unique place (and optimized too!) to store your templates:

app.run(function($templateCache) {
  $templateCache.put('app.html', '<span> app.html content </span>');
});

and your ng-include will find automagically your app.html template. You should do this also for your template1 variable, and retrieve it in your JS by using:

$templateCache.get('template1.html')
jbobbins
  • 1,221
  • 3
  • 15
  • 28
illeb
  • 2,942
  • 1
  • 21
  • 35
  • I did that already but i'm not getting the entire output. I'm getting an array as [COMMENT], and inside the array i don't see any output though – rUI7999 Sep 09 '16 at 15:41
  • your ""div ng-include="'/app.html' has a opening bracket <, right? – illeb Sep 09 '16 at 15:42
  • Nothing to do with the syntax $scope.template1 = $compile("
    ")($scope);
     – rUI7999 Sep 09 '16 at 15:44
  • Maybe /app.html it's in another url? you should provide more code: by here i can make only assumptions – illeb Sep 09 '16 at 15:47
  • I created a sample plunker, bear me if there are some mistakes in it https://plnkr.co/edit/y1ooATcxQBA7la9Q3lzi?p=preview – rUI7999 Sep 09 '16 at 16:00