Question

<div ng-repeat="(key,x) in selectedPoll.questions">
    <p>{{x}}</p>
    <p>{{key}}</p>
    <canvas chart-directive data="arrayResult.{{key}}" id="{{ $index }}">
    </canvas>
</div>

当我在图表指令的全局范围内使用{{key}}时，{{$ index}}无法访问，但是当我删除{{key}}并且只留下arrayResult时，ng-repeat正在工作。< / p>

说明：我使用id {{$ index}}，它由chart-directive搜索ng-repeat中的每个x，因此我可以根据需要创建尽可能多的图表指令。

然后，为了使一切正常工作，我必须传递正确的数据集，chart-directive的每个数据集与ng-repeat中的x的{{key}}具有相同的结尾，例如：

 data="arrayResult.q1 "

使其动态我想将其切换为：

 data="arrayResult.{{ key }}

但是当我添加{{key}} ng-repeat stop时会出现一个我认为正在发生的结果，因为它无法读取{{$ index}}的id值

这是我第一次使用带有ng-repeat的key和$ index，这是我第一次重复自定义指令，所以我不知道问题是重复自定义指令还是错误使用{{key}}值。

就在我添加问题的时候，一些解决方案出现在我脑海中，可能会发生这种情况，因为在我的自定义指令中，我的scope.data看起来像这样

   scope: {
                data:'='
            },

所以，如果我是对的，如果有人可以告诉我是否可能，以及是否如何使范围数据打开以表达这样的表达式＆＃34; arrayResult。{{key}} ??

Answer 1

仅当您的图表数据是字符串时，才使用@。

您可以保留指令的=，但需要更改：

data="arrayResult.{{key}}"

进入这个：

data="arrayResult[key]"

curcly括号仅适用于@确定范围，但您将获得字符串"arrayResult.q1"而不是arrayResult.q1中实际值，因此=是要走的路。

请参阅下面的模拟片段：

＆＃13;

angular.module("test", []).controller("test", function($scope) {

  $scope.questions = {q1: "do you like apples?", q2: "do you like bananas?"};
  
  $scope.arrayResult = {q1: true, q2: false};

});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="test" ng-controller="test">
  <div ng-repeat="(key,x) in questions">
      <p>question: {{x}}</p>
      <p>key: {{key}}</p>
      <div>result: {{arrayResult[key]}}</div>
      </canvas>
  </div>
</div>

＆＃13;

ng-repeat =“（key，value）”不能将{{key}}的值用作另一个指令的全局范围的一部分

1 个答案: