Angularjs指令:隔离的范围和attrs

请看这里的例子

foodMeApp.directive('fmRating', function() { return { restrict: 'E', scope: { symbol: '@', max: '@', readonly: '@' }, require: 'ngModel', link: function(scope, element, attrs, ngModel) { attrs.max = scope.max = parseInt(scope.max || 5, 10); ... 

Angular需要readonly symbol max ,以便在隔离的作用域对象中定义从父作用域访问它。

它在这里使用

<fm-rating ng-model="$parent.restaurant.price" symbol="$" readonly="true"></fm-rating>

那么, attrs的目的是什么呢? 不能访问通过attrs传递的所有属性。 为什么不能访问最大值为attrs.max而不是scope.max

为什么要像attrs.max = scope.max那样分配?

由于这个应用程序是由Angular作者编写的,我期待一个理由。

谢谢。

attrs的目的是什么?

在与您的指令相同的元素上定义的属性有几个目的:

  1. 它们是将信息传递到使用隔离范围的指令的唯一方法。 由于指令隔离范围没有从父范围原型inheritance,所以我们需要一种方法来指定我们想要传递给隔离范围的内容。 “对象散列”中的“@”,“=”和“&”因此每个都需要一个属性来指定传递哪些数据/信息。
  2. 他们作为一个互相指导的沟通机制。 (例如, 独立pipe理独立的AngularJS指令之间的通信 )
  3. 他们规范了属性名称。

不能访问通过attrs传递的所有属性吗?

是的,你可以,但是

  1. 你将不会有任何数据绑定。
    '@'设置单向“string”数据绑定(父范围→指令隔离范围)使用@你在指令中看到/得到的值总是一个string,所以如果你想通过一个string反对你的指示。
    '='设置双向数据绑定(父范围↔指令隔离范围)。
    没有数据绑定,你的指令不能自动监视模型/数据。
  2. {{}}的属性值会导致你的问题,因为它们不会被内插。
    假设我们有<my-directive name="My name is {{name}}"> ,父范围有$scope.name='Mark' 。 然后,在链接函数中, console.log(attrs.name)导致undefined
    如果name是用'@'定义的孤立范围属性,则attrs.$observe('name', function(val) { console.log(val) })结果My name is Mark 。 (请注意,在链接函数中,必须使用$ observe()来获取插值。)

为什么不能访问最大值为attrs.max而不是scope.max

上面回答

为什么要像attrs.max = scope.max那样分配?

我能想到的唯一原因是为了防止其他指令需要看到这个属性/值(即指令间通信)。 然而,另一个指令需要在这个指令之后运行(这可以通过priority指令设置来控制)。

总结:在一个隔离范围的指令中,通常你不想使用attrs 。 (我想这可能是一种将初始化数据/值发送到指令的方式 – 也就是说,如果您不需要这些值的数据绑定,并且不需要插值)。

使用attrs你可以访问html标签中定义的属性

 <fm-rating ng-model="$parent.restaurant.price" symbol="$" readonly="true"> 

所以在这种情况下,您将可以访问符号只读属性。 您在自定义指令中定义的每个属性都可用于attrsvariables。

该块:

 attrs.max = scope.max = parseInt(scope.max || 5, 10); 

parsing和分配当前scope.max值或5 ,如果不存在,则为scope.max和attrs.max。 这样, 你可以从attrs.max中读取作业 。 在此之前,attrs.max属性中的undefined。

检查fmRating.js源码,我不知道为什么/何地/何时使用这段代码。