Angular ng-click函數並不總是觸發

我有一個Angular ng-click函數並不總是觸發。Angular ng-click函數並不總是觸發

URL是在這裏：http://430designs.com/xperience/black-label-app/deck.php

功能是clickLike這裏：

$scope.clickLike = function() { 
     $('.icon-like').on('click', function(){ 
     $(this).toggleClass('happy'); 
     }); 
    };

我打電話是在HTML像這樣：

<div class="icon-like" ng-click="clickLike()"</div>

檢查鏈接，你可以在controller.js第214行調試。我不知道發生了什麼事。

所有幫助非常感謝！

來源

2016-12-14 lz430

你不需要內部$scope.clickLike

<div class="icon-like" ng-click="clickLike($event)"</div> 

$scope.clickLike = function(e) { 
    e.currentTarget.toggleClass('happy'); 
});

的onclick方法e.currentTarget將觸發事件的元素。

您還需要通過$event你NG-點擊指令：

下面是一個例子：http://www.freedevelopertutorials.com/angularjs-tutorial/examples/angularjs-event-example/

來源

2016-12-14 02:25:25

我們是否需要在ng-click函數中傳遞'$ event'並在範圍函數中捕獲？ –

@ A.J對不起，我忘了那個。但嘿，謝謝你指出:) –

沒問題。編輯答案。 :) –

您需要通過$event和Click事件中捕捉$event。然後您可以使用$event.target訪問該元素。

示例代碼段：

angular.module("myApp", []) 
 
    .controller("myController", function($scope) { 
 
    $scope.clickLike = function($event) { 
 
     angular.element($event.target).toggleClass("hello") 
 
    } 
 
    })

.hello { 
 
    color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div class="icon-like" ng-app="myApp" ng-controller="myController" ng-click="clickLike($event)">Hello</div>

來源

2016-12-14 02:41:19

所以你需要使用指令操縱你的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>

來源

2016-12-14 02:56:39 btinoco

Angular ng-click函數並不總是觸發

回答

相關問題