如何使用 angular 查找动态添加的类名

Question

在我看来，我有几个 id 为 :

的 div

<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>

我需要根据它们的 ID 获取这些 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})

不过话又说回来，这段代码需要在angular渲染完HTML插值后执行，这个很难判断。

更好的方法是使用 ng-style，它适用于这种情况：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>

...

如何使用 angular 查找动态添加的类名

How to find the dynamic added classNames using angular

javascript

css

angularjs

jqlite