AngularJS 2 中如何实现ng-bind-html
2016-12-15 00:10
615 查看
问题:
在AngularJS 1.x 中可以使用ng-bind-html来插入一段html代码,相当于struts2 标签的escape属性。但是AngularJS 2中取消了ng-bind-html,当项目中确实有需要动态插入html代码的时候我们该怎么做呢?解决方法:
使用[innerHtml]代替ng-bind-html。innerHtml属性,用于设置标签内的html,[innerHtml]=”data.title”用于动态将AngularJS 2的变量值赋给innerHtml属性,以实现ng-bind-html的效果。
完整示例:
search.component.html<a href="#" target="_blank" [innerHtml]="data"></a>
search.component.ts
export class SearchComponent { private data: string = "<b>helloWorld</b>"; }
转自:http://www.lvhongqiang.com/blog425.html
相关文章推荐
- AngularJS 2 中如何实现ng-bind-html
- angularjs 的ng-bind-html过滤了内容的style
- 深入理解AngularJS中的ng-bind-html指令和$sce服务
- angularjs中ng-bind-html的用法总结
- AngularJs ngApp、ngBind、ngBindHtml、ngNonBindable
- AngularJs中 ng-repeat指令中实现含有自定义指令的动态html的方法
- AngularJS使用ng-bind-html会过滤html中style属性的问题
- 解决AngularJS使用ng-bind-html会过滤html中style属性的问题
- angularJs 中的ng-bind-html指令和$sce服务
- angularjs 可以加入html标签方法------ng-bind-html的用法总结(2)
- angularjs中使用ng-bind-html和ng-include的实例
- ANGULARJS中用NG-BIND指令实现单向绑定的例子
- AngularJS中ng-model如何实现非实时同步
- 利用AngularJS中ng-include实现静态HTML头文件和尾文件导入
- angularjs 指令ng-bind-html
- [Angularjs]ng-bind-html指令
- 深入理解AngularJS中的ng-bind-html指令
- angularjs中ng-bind-html使用问题
- ANGULARJS中用NG-BIND指令实现单向绑定的例子
- 解决AngularJS使用ng-bind-html会过滤html中style属性的问题