如何使用 2 路绑定动态命名指令范围的模型？

Question

我正在尝试使用ng-repeat 将对象值动态传递给指令，如下所示：

<td ng-repeat="attr in demographicAttrs">
  <yes-no name="{{ attr }}-{{ $index }}"
    model="ambassador.demographic.{{ attr }}"
    update="calcScore(ambassador)"></yes-no>
</td>

指令定义为

function (
  $rootScope
) {
  "use strict";

  return {
    restrict: 'E',
    replace: true,
    templateUrl: 'templates/yesNo.html',
    scope: {
      "name": "@",
      "model": "=",
      "update": "&"
    },
    link: function(scope, element, attrs) {
      scope.$watch('model', function(value) {
        scope.update();
      });
    }
  };
};

所以我试图动态生成要在ambassador.demographic.{{ attr }} 中观看的模型，但是= 指令的2 路绑定不喜欢以这种方式生成的值。

我收到此错误：https://docs.angularjs.org/error/$parse/syntax?p0=%7B&p1=is%20an%20unexpected%20token&p2=24&p3=ambassador.demographic.%7B%7B%20attr%20%7D%7D&p4=%7B %7B%20attr%20%7D%7D

我该怎么做？

更新

• 我也尝试过使用 ambassador.demographic[{{ attr }}]，但这也不起作用（关闭，但需要删除 {{ }}，根据 https://stackoverflow.com/a/23405825/111884）
• 我找到了这个Setting dynamic scope variables in AngularJs - scope.<some_string>，但$parse 在html 中似乎不起作用

Answer 1

更改模型表达式以使用 javascript 括号表示法：

model='ambassador.demographic[attr]'

Fiddle