AngularJS $compile动态生成html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | angular.module( 'app' ) .directive( 'compile' , function ($compile) { return function (scope, element, attrs) { scope.$watch( function (scope) { return scope.$eval(attrs.compile); }, function (value) { element.html(value); $compile(element.contents())(scope); } ); }; }); |
1 2 3 4 5 6 | <div ng-app= "app" ng-controller= "SampleCtrl" class = "container" > <div ng-repeat= "item in items" > {{item.name}}<br /> <div compile= "item.tempatle" ></div> </div> </div> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | <script> angular .module( 'app' ) .controller( 'SampleCtrl' , function ($scope, $filter) { $scope.open = function () { alert( "ddd" ); } $scope.items = [ { "name" : "zhangsan" , tempatle: '<i class="searchicon fa fa-search" ng-click="open()" style="color:#5db2ff;cursor:pointer;">点击</i>' }, { "name" : "lisi" , tempatle: '<i class="searchicon fa fa-search" ng-click="open()" style="color:#5db2ff;cursor:pointer;">点击</i>' }, { "name" : "wangwu" , tempatle: '<i class="searchicon fa fa-search" ng-click="open()" style="color:#5db2ff;cursor:pointer;">点击</i>' }] }); </script> |
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 单线程的Redis速度为什么快?
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?
· 展开说说关于C#中ORM框架的用法!