angularjs - ng-attr 不评估指令元素

Question

我正在尝试使用元素属性将数据从 Controller 传递到隔离的范围。这是我在 View 中的标签:

<comment ng-attr-cid="{{question.id}}" ctype="questions"></div>

这是指令:

'use strict'

angular.module('arlo.directives').directive "comment", ['Comment', (Comment) ->
  directive =
    templateUrl: "angular/partials/comment.html"
    restrict: "E"
    scope:
      cid: "="
      ctype: "="

    link: (scope, element, attrs) ->
      scope.toggled = false
      scope.comment = null
      scope.comments

      scope.toggle = ->
        if scope.toggled is true then scope.toggled = false else scope.toggled = true
        scope.comment = null

      scope.addComment = ->
        Comment.addComment(scope.ctype, scope.cid, scope.comment).then ->
          scope.comments = Comments.commentsList
          scope.toggled = false
          scope.comment = null

      scope.loadComments = ->
        Comment.loadComments(scope.ctype, scope.cid).then ->
          scope.comments = Comments.commentsList

      scope.loadComments()
]

问题是 cid 被分配了“{{question.id}}”而不是 question.id 的值。我尝试使用 ng-attr-cid="question.id"但这也不起作用。最重要的是，ctype 被评估为未定义。

如果我在任何其他元素上添加 ng-attr-cid，它会评估并将 cid=""添加到元素。

有人可以解释一下我缺少什么吗？

Answer 1

在隔离的作用域中(在指令上指定作用域对象时会得到什么)，您可以根据原始元素的属性将变量导入作用域。

在这种情况下，不需要使用 ng-attr因为我们的指令将处理获取值。

"="用于当您要复制变量时，因此您只需提供变量名称，例如cid="question.id"

"@"用于在将变量传递给指令之前对其进行插值的情况，例如cid="{{question.id}}" .传递原始字符串也非常方便。

简而言之

放下 ng-attr

更改指令 scope.cid至 "@"或使用 cid="question.id"在您的 HTML 中

检查 questions 的值(不确定这是否是故意复数，因为 ctype 在您的指令中未定义，这意味着 questions 也未定义。

这是一个 plnkr showing the fix .