Как найти динамические добавленные имена классов, используя угловой

Question

На мой взгляд, у меня есть несколько дивы, чьи идентификаторы:

<div ng-src="{{board[0].url)}}" autosize="off" id="{{board[0].name}}"></div> 
    <div ng-src="{{{board[1].url)}}"autosize="off" id="{{board[1].name}}"></div> 

Мне нужно получить эти дивы на основе их идентификаторами и применить стиль к нему. Как я могу это достичь? Есть ли что-то вроде этого:

angular.forEach($scope.boards, function(board){ 
    $document.find('#board.name').css({'width': board.position.width, 'height' : board.position.height}) 
} 

Answer 1

вам не нужно использовать JQuery и ng-style директива может сделать то же самое для вас

<div ng-src="{{board[0].url)}}" ng-style="{width:board[0].position.width,height:board[0].position.height}" autosize="off" id="{{board[0].name}}"></div> 
<div ng-src="{{{board[1].url)}}" ng-style="{width:board[1].position.width,height:board[1].position.height}" autosize="off" id="{{board[1].name}}"></div> 

Answer 2

Вы могли

$document.find('#' + board.name).css({'width': board.position.width, 'height' : board.position.height}) 

Но затем снова , этот код должен быть выполнен после угловых окон, что делает интерполяцию HTML, которую трудно определить.

Лучше было бы использовать нг-стиль, который был предназначен для ситуаций, как это: https://docs.angularjs.org/api/ng/directive/ngStyle

Итак:

<div ng-src="{{board[0].url)}}" ng-style="{width: board[0].position.width, height: board[0].position.height}" autosize="off" id="{{board[0].name}}"></div> 

...