angularjs - Angular 1.2: custom directive's dynamic content: ng-click doesn't work -
i trying simple thing in angular 1.2: want create dynamic content custom directive, , add click handler (clickcustomer) parts of it. however, when in following pattern, whilst clickcustomer function available on element's scope, not invoked when clicking on it. i'm gussing need angular compile dynamic content, i'm not sure if that's case, , if is, how so.
'use strict'; angular.module('directives.customers') .directive('customers', function () { return { restrict: 'a', replace: true, template: '<div class="customers"></div>', controller: function ($scope, $element) { var customers = ['customer1', 'customer2', 'customer3']; var customersmapped = customers.map(function (customer) { return '<span ng-click="clickcustomer()" data-customer="' + customer + '">' + customer + '</span>'; }); var text = customersmapped.join(', '); $element.html(text); $scope.clickcustomer = function (event) { console.log('customer clicked', event); } } }; });
you're right, need use $compile service , compile attached dom elements angular set events , scopes.
check this fiddle.
Comments
Post a Comment