javascript - ng-click not working in dynamic html of a directive -
my problem seems relatively similar ng-click not working in dynamically created content solution posted there not working me.
the entire goal have directive generate html based on variable in controller's scope. generated html have replaced ${foobar} clickable span text foobar execute function on controller's scope when clicked.
i have directive:
.directive('markup', function($compile) { var convertparameters = function(text) { var matches = text.match(/\${.*}/); if(!matches) { return text; } for(var i=0;i<matches.length;++i) { var match = matches[i]; var label = match.substring(2,match.length-1) text = text.split(match).join('<span ng-click="expose(\'' + label + '\')">' + label + '</span>'); } return text; } var link = function(scope, element, attrs) { var text; if (scope.markup) { text = scope.markup; } else { text = element.text(); } element.html(""); element.append($compile(convertparameters(text))(scope)); }; return { restrict: 'a', scope: { markup: '=', expose: '&' }, replace: true, link: link }; });
the directive used in html as:
<div class="full-text" markup="fulltext" expose="exposedoc"></div>
fulltext = "this initial test. have link here: ${testdocument}."
exposedoc defined on controller's scope as:
$scope.exposedoc = function(name) { $log.error(name); };
everything rendered correctly when on testdocument text nothing happens. no errors occur 1 expect logged. inspecting element shows ng-click attribute.
here plunker showing issue: http://plnkr.co/edit/ufjm8evq43pdm69shqwn?p=preview
any can provided appreciated!
eureka! figured out issue. problem not ng-click not working function not provided angular requires.
when using directive needed specify function this:
<div class="full-text" markup="fulltext" expose="exposedoc(doc)"></div>
where doc placeholder , when calling function directive need call object placeholder's value parameter. this:
'<span ng-click="expose({doc:\'' + label + '\'})">' + label + '</span>'
here plunker of functioning.
Comments
Post a Comment