2016-04-13 5 views
1

Я пытаюсь (все еще учиться), чтобы получить значение выражения NG-Repeat вне NG-Repeat и использовать его как значение внутри класса. Это секция NG-Repeat (я упростил ее):NG-Repeat выражение вне NG-Repeat

Classiccds - это массив, который я получаю от JSON, а цветной код - colomn внутри, каждый диск имеет другой цветовой код.

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

РЕЗУЛЬТАТ: #ffffff

Вышеприведенные работает нормально, она возвращает мне ColorCode первого компакт-диска в массиве , но я также хотел бы использовать его в другом месте, за пределами массива, на фон страницы (так как он возвращает только одну строку) как таковой.

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

ответ

1

Вы можете просто установить этот элемент в Вашей области в контроллере, как:

$scope.cd = classiccds[0]; 

и уйти с самого ng-repeat:

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

или вы можете сделать:

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

спасибо она работала идеально –

1

Если первый значение в массиве особенно полезно для вас, я предлагаю вам сохранить его в отдельной переменной в области, поэтому вы можете легко использовать его из нескольких мест. Что-то вроде этого:

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

Затем вы можете использовать его в HTML, как это:

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

да действительно отличная идея! Я добавил дополнительную область в функцию рядом с массивом. Спасибо. –