通過jQuery添加NG-style屬性，角度不更新

這裏有一個plunker演示問題：http://plnkr.co/edit/1ceWH9o2WNVnUUoWE6Gm 通過jQuery添加NG-style屬性，角度不更新

代碼：

var app = angular.module('myApp', []); 
app.controller('myCtrl', function($scope) { 
    console.log('yeah'); 
    var header = $('#weird'); 
    console.log(header); 
    header.attr("ng-style", "{'background-color' : 'red'}") 
});

它添加了NG-style屬性，但角度不知道關於它，所以它從來沒有應用。

這是我想要做的簡化版本，我試圖在chessboard.js生成的國際象棋棋盤中的每個方塊中添加一個ng樣式的屬性。我這樣做是通過將ng樣式屬性添加到編譯函數中的每個方塊，就像我將ng樣式屬性添加到標頭一樣。如果有更好的方法來做到這一點，我很想知道它。如果不是，那麼添加ng樣式屬性時如何才能更新角度？

我讀過關於$scope，$digest和$apply，我試過和他們一起玩，但一直沒弄明白。什麼是實現這一目標的最佳方式？

來源

2015-04-07 Marcus Buffett

DOM操作應該在指令鏈接函數而不是控制器中處理。另外指令元素固有地使用jquery lite。我建議調查一下。 – Dom

我已經將它移入鏈接函數，但不幸的是仍然存在同樣的問題。我不認爲用jQuery lite代替jQuery會改變任何東西。 –

這是錯誤的做法。添加ngStyle並將其綁定到條件espression。你不應該動態添加屬性 – pixelbits

這取決於指令究竟如何工作的，但在ngStyle情況下，你可能需要重新編譯元素：

app.controller('myCtrl', function($scope, $compile) { 
    console.log('yeah'); 
    var header = $('#weird'); 
    console.log(header); 
    header.attr("ng-style", "{'background-color' : 'red'}"); 
    $compile(header)($scope); 
});

$apply當角與純JS/jQuery的混合通常提出，但它只有在作用域綁定需要更新時纔有意義，事實並非如此。此外，當異步回調函數發生時，它是有意義的，但是在控制器構造函數中發生的範圍變化被應用（沒有魔術區分角度和非角度的東西，所以'$ apply already already progress'出現，如果你觸發當你不需要時摘要）。

我假設你故意使用jQuery，並且我可以爲你省去'角色恨 - jquery-selectors-bad-bad-you-re-doing-it-wrong'單調乏味。

來源

2015-04-07 02:01:59 estus

通過jQuery添加NG-style屬性，角度不更新

回答

相關問題