所以你需要使用指令操縱你的DOM ...這是不是從控制器操作DOM的最佳實踐。查看這個例子,我創建了一個用作屬性的指令(就像ng單擊一樣),並將一個類應用到該指令是屬性的元素。
從角網站:
使用控制器:
- 搭建$範圍對象
- 添加行爲到$ scope對象的初始狀態。
不要使用控制器:
- 操作DOM - 控制器應該只包含業務邏輯。將任何表示邏輯放入控制器中會顯着影響其可測試性。 Angular對大多數情況和指令進行了數據綁定,以封裝手動DOM操作。
- 格式輸入 - 使用角度控件代替。
- 過濾器輸出 - 改用角度過濾器。在控制器之間共享代碼或狀態 - 代之以使用角度服務。
- 管理其他組件的生命週期(例如,創建服務實例)。
讓我知道如果這能幫助:https://plnkr.co/edit/hyS5yxwajbJKSFYylKDw?p=preview
angular.module('plunker', [])
.directive('clickLike', [clickLike])
.controller('HomeController', [HomeController]);
function clickLike() {
var self = {};
self.restrict = 'A';
self.link = linkFn;
return self;
function linkFn($scope, $element, $attributes) {
$element.on('click', function(event) {
$element.toggleClass('happy');
});
}
}
function HomeController() {
var self = this;
self.message = "Hello World!";
}
在你的HTML,你可以在任何element..not緊密地結合到你的控制器使用該指令..
<div class="icon-like" click-like></div>
我們是否需要在ng-click函數中傳遞'$ event'並在範圍函數中捕獲? –
@ A.J對不起,我忘了那個。但嘿,謝謝你指出:) –
沒問題。編輯答案。 :) –