一、Html代码：

1  2  3  4     
      5      6      7  8  9     
     10 11 

 

二、tmp.html文件

1 
     
      2     我是测试的模板内容！3 
     

 

 

三、Js代码：

 

1     //初始化Angular对象 2     var myNg = angular.module('mainApp', []); 3  4     myNg.directive('quberGrid', function () { 5         return { 6             restrict: 'EA', 7             replace: true,//移除
     
      标签 8             templateUrl: 'tmp.html', 9             link: function (sco, ele, attr) {10                 //通知下属DOM，执行名为sendChildGridAttr的事件11                 sco.$broadcast('sendChildGridAttr', attr);12             }13         };14     });15     myNg.directive('quberGridAttr', function () {16         return {17             restrict: 'A',18             link: function (sco, ele, attr) {19                 sco.$on('sendChildGridAttr', function (event, data) {20                     angular.forEach(data, function (val, key, obj) {21                         if (key != '$attr' && key != '$$element') {22                             //设置标签属性和值23                             attr.$set(key, val);24                         }25                     });26                 });27             }28         };29     });30 31     myNg.controller('mainController', function ($scope) { });
     

 

 

效果如下所示：