无法使用angular-template访问数组项

时间:2017-05-25 19:57:57

标签: angularjs arrays reference angular-template

我的代码如下:

<div ng-repeat="person in Emotions" class="crop-item">
  <div class="text-left">
    <ul class="list-group no-buletts">

      <li class="list-group-item" style="width: 300px;">
        <img class="crop-img" alt="crop image" src="http://192.168.153.131:7000/tmp/{{Emotions['emotion-original-image-ref']}}.jpg.crop-{{$index}}.jpg"></img>
        Top score: {{Emotions["emotion-top-scores"].$index}}

      </li>

      <li ng-repeat='(scoreTitle,scoreValue) in person.scores' class="list-group-item">
        <div class="row">
          <div class="col-md-6 text-left">
            <label for="{{scoreTitle}}">{{scoreTitle}}: </label>
          </div>
          <div class="col-md-6 text-left">
            {{scoreValue * 100 | number:2}} %
          </div>
        </div>
      </li>

    </ul>
  </div>
</div>

我有这个“Emotions”对象有这个内容:

{
  "emotion-status-code": 200,
  "emotion-response": [{
    "faceRectangle": {
      "height": 72,
      "left": 147,
      "top": 122,
      "width": 72
    },
    "scores": {
      "anger": 0.00165787316,
      "contempt": 0.000218306363,
      "disgust": 0.0000283911031,
      "fear": 3.707502e-7,
      "happiness": 1.67207048e-8,
      "neutral": 0.948927,
      "sadness": 0.04916397,
      "surprise": 0.000004111683
    }
  }],
  "emotion-original-image-ref": "e8c3a383-bba8-4015-a9de-a5bbc70843b2",
  "emotion-top-scores": ["neutral"]
}

问题出现在这里的代码段中:

Top score: {{Emotions["emotion-top-scores"].$index}}

我已经检查了'$ index'并且它正在按照'ng-repeat'的方式带来索引,但我无法访问该值,我不知道为什么。我相信我做的事情很傻。我试着这样做:

Top score: {{Emotions["emotion-top-scores"][$index]}}

Top score: {{Emotions["emotion-top-scores"][0]}}

再次失败。

请你在这个“史诗般的”情况下帮助我吗?

1 个答案:

答案 0 :(得分:0)

好吧,我做到了!但吸引丑陋的XHG。我创建了一个'ng-model'变量,并通过控制器直接在这个变量上写了响应体的内容。工作但很糟糕!在控制器......

$scope.topScores = res["emotion-top-scores"];

在HTML

<li class="list-group-item" style="width: 300px;" ng-model="topScores" >

希望有更好的解决方案。真的很糟糕!我真的很惭愧!