Let's say I have the following markup:
<main ng-controller="MainController">
<article id="story-container"></article>
<button ng-click="newSection()">+ Add Section</button>
</main>
I need to compile and append the following template inside article element
on button click.
<script id="newSectionTmpl" type="text/ng-template">
<section>Hello, {{name}}!</section></script>
I have tried something like this, but not sure if this is a good approach:
app = angular.module('myApp', []);
app
.controller('MainController',['$scope', '$compile', function($scope,
$compile) {
$scope.name = "Denis";
$scope.newSection = function() {
var tmpl = $('#newSectionTmpl').html();
var $el = $('#story-container');
console.log(tmpl);
var html = $compile(tmpl)($scope);
$el.append(tmpl);
}
} ]);
Also, how can I load my template from external file? Here is the link to
jsBin:http://jsbin.com/zuyicewexahi/5/edit?html,js,output
<http://jsbin.com/zuyicewexahi/latest>
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
