angularjs가있는 동작에서 부모 요소 찾기/가져 오기

Question

버튼이있는 div 구조가 있습니다. 즉

그리고 내가해야 할 곳에서 data- * attribute 값을 얻고 싶습니다.

조치가 트리거 한 요소의 이벤트를 알고 있습니까? 그렇다면이 요소에 액세스하여 필요한 부모를 찾는 방법?

Answer 1

먼저 이벤트 [1]을 ng-click 기능의 매개 변수로 보낼 수 있습니다. 이처럼 : [2] 당신이 원하는 것을 얻을 angular.element을 사용하여 함수의

<input type="button" value="Press me" class="button-one" ng-click="doSomething($event)" /> 

후. 이처럼 :

Example.controller('ParentCtrl', ['$scope', function($scope) 
{ 
    $scope.doSomething = function(event) 
    { 
     var target = angular.element(event.target); //this target is a jQuery lite object 
     // now you can do what you want through the target 
    }; 
}]); 

[1] http://docs.angularjs.org/api/ng.directive:ngClick

[2] http://docs.angularjs.org/api/angular.element

Answer 2

DOM의 속성에 액세스하는 "각도"는 사용자 지정 지시문을 만드는 것입니다. 컨트롤러에서 DOM에 액세스하고 구조에 대한 가정을하는 것은 Angular가 권장하는 책임의 분리를 위반하는 것 같습니다.

그러나, 지시어를 작성의 복잡성을 피하기 위해, 당신의 목표에 매개 변수를 전달할 수 있습니다과 같이, NG를 클릭 :

<input type="button" value="Press me" class="button-one" ng-click="doSomething(2)" /> 

개체를 포함 :

<input type="button" value="Press me" class="button-one" ng-click="doSomething({dataImage:2})" /> 

을 당신은 또한 수 변수를 $ scope 변수에 저장하면 배열의 색인이나 객체의 키만 컨트롤러의 함수로 전달하면됩니다. 따라서 다음과 같은 것이 있습니다 :

var Example = angular.module('example', []); 

Example.controller('ParentCtrl', ['$scope', function($scope) { 
    $scope.things = [{something:123},{something:432]; 
    $scope.doSomething = function(index) { 
    var thing = $scope.things[index]; 
    }; 
}]); 

도 DOM에 물건을 보관하지 않아도됩니다.