Html NG Repeat表达式值位于NG Repeat外部

我正在尝试（仍在学习）在NG Repeat之外获取NG Repeat表达式的值，并将其用作类中的值。这是NG重复部分（我简化了它）：

Classiccds是我从JSON获得的数组，其中的颜色代码是一个列，每个cd都有不同的颜色代码

<div ng-repeat="cd in cds = (classiccds | limitTo:1)">
  <div>{{cd.colorcode;}}</div>
</div>

{{cd.colorcode；}}

结果#ffffff

上面的操作很好，它返回数组中第一张cd的颜色代码 但我也希望在数组之外的其他地方，在页面背景上使用它（因为它只返回一行）

---

您只需在控制器中将此项设置为您的作用域，如：

$scope.cd = classiccds[0];

并避免使用
ng repeat
本身：

<div style="background-color:{{cd.colorcode}}">
  <div>
    <div>{{cd.colorcode;}}</div>
  </div>
</div>


{{cd.colorcode；}}

或者你可以：


{{cd.colorcode；}}
如果数组中的第一个值对您特别有用，我建议您将其存储在作用域上的一个单独变量中，以便您可以从多个位置轻松重用它。大概是这样的：

function yourCtrl($scope) {
    $scope.cds = //Your array
    $scope.interestingColor = $scope.cds[0].colorcode
}

<div style="background-color:{{interestingColor}}>
  <div ng-repeat="cd in cds = (classiccds | limitTo:1)">
    <div>{{cd.colorcode;}}</div>
  </div>
</div>

然后您可以在html中使用它，如下所示：

function yourCtrl($scope) {
    $scope.cds = //Your array
    $scope.interestingColor = $scope.cds[0].colorcode
}

<div style="background-color:{{interestingColor}}>
  <div ng-repeat="cd in cds = (classiccds | limitTo:1)">
    <div>{{cd.colorcode;}}</div>
  </div>
</div>

是的，的确是个好主意！我在数组旁边的函数中添加了额外的作用域。非常感谢。