附加ng-click以动态更改html

时间:2022-10-22 09:11:13

I have a ng-repeat for descriptions that have tags. I use init to filter the tags to rewrite the description with ng-click. However the ng-click doesn't work after. Is this possible?

我有一个ng-repeat有关标签的描述。我使用init来过滤标签,用ng-click重写描述。但是,ng-click后不起作用。这可能吗?

<div ng-repeat="desc in descs">
   <div ng-init="desc.description = getTags(desc.description )">
      {{ desc.description }}
   </div>
</div> 

<script>
$scope.getTags = function(desc) {
   var desc = desc.replace("#tag", '<span ng-click="function">#tag</span>');
   return desc;
}
</script>

Thanks

2 个解决方案

#1


Injected HTML code into AngularJS shall be processed with $compile

注入AngularJS的HTML代码应使用$ compile进行处理

See official doc here : https://docs.angularjs.org/api/ng/service/$compile

请参阅官方文档:https://docs.angularjs.org/api/ng/service/$compile

#2


You need to use ng-bind-html but you also need to create one filter that will sanitize that html using $sce service trustAsHtml method.

您需要使用ng-bind-html,但您还需要创建一个使用$ sce service trustAsHtml方法清理该html的过滤器。

Markup

<div ng-repeat="desc in descs">
   <div ng-bind-html="getTags(desc.description) | trustHtml">
   </div>
</div> 

Filter

app.filter('trustHtml', function($sce) { 
  return function(text) {
    $sce.trustAsHtml(text);
  };
}

#1


Injected HTML code into AngularJS shall be processed with $compile

注入AngularJS的HTML代码应使用$ compile进行处理

See official doc here : https://docs.angularjs.org/api/ng/service/$compile

请参阅官方文档:https://docs.angularjs.org/api/ng/service/$compile

#2


You need to use ng-bind-html but you also need to create one filter that will sanitize that html using $sce service trustAsHtml method.

您需要使用ng-bind-html,但您还需要创建一个使用$ sce service trustAsHtml方法清理该html的过滤器。

Markup

<div ng-repeat="desc in descs">
   <div ng-bind-html="getTags(desc.description) | trustHtml">
   </div>
</div> 

Filter

app.filter('trustHtml', function($sce) { 
  return function(text) {
    $sce.trustAsHtml(text);
  };
}