指令不能访问范围数据源

Question

我有简单的指令，这样

查看：

<div ng-if="newReg.checkedDomains.length>0">  
    <div extension-list="newReg.checkedDomains"></div> 
</div> 

指令：

angular.module('starweb') 
.directive('extensionList', function() { 
    return { 
     link: function (scope, element, attrs) { 

      var data = scope[attrs['extensionList']]; 
      console.log(data); 
     }, 

     template:"<div>test</div>" 
    } 
}); 

控制台日志总是显示不定？为什么指令不能访问extensionList源数据？

Answer 1

extensionList属性拥有一个绑定表达式，带点的属性链，不能直接使用对象上的括号表示法进行访问。所以你只需要eval就可以了。如果它只是直接在范围上的一个属性，那么你在范围上试图执行的括号表示法已经起作用了，但在实际情况中，你是一个更低的级别（提供了范围的属性名称和属性名称是相同的）。

尝试： -

var data = scope.$eval(attrs.extensionList); 
console.log(data); 

Demo