为什么我无法获取自定义指令的属性值？

Question

angularjs 代码：

app.directive('test', function(){
  return {
    restrict: 'A',
    scope: {
      myId: '@'
    },
    link: function(scope) {
      alert(scope.myId);
    }
  }
});

你可以看到指令中有一个scope: { myId: '@' }。

还有html代码：

<div test my-id='123'></div>

你可以看到我定义了一个my-id='123'。

我希望该指令会提醒123，但它会提醒undefined。我的错在哪里？

PS：这是一个现场演示：http://plnkr.co/edit/sL69NqWC70Qfwav5feP2?p=preview

Answer 1

您需要$observe 属性（如http://docs.angularjs.org/guide/directive 的“属性”部分所述）来获取插值属性的正确值。

这是一个有效的 plunk：http://plnkr.co/edit/NtIHmdoO7IAEwE74ifB5?p=preview

这本质上是angularjs : logging scope property in directive link function displays undefined 的复制品。还应该注意的是，PR https://github.com/angular/angular.js/pull/1555 最近被合并了，你的 plunker 应该在不使用 $observe 的情况下在 AngularJS 的未来版本中工作。

--

有问题的演示在最新版本中工作：1.1.3，你可以试试（并将 angularjs url 更改为 1.1.3）。