AngularJS 추상화 지시문

Question

어떻게 지시문을 올바르게 추상화합니까? http://plnkr.co/edit/h5HXEe?p=info

var app = angular.module('TestApp', []); 

app.controller('testCtrl', function($scope) { 
    this.save = function() { 
    console.log("hi"); 
    } 

    this.registerListeners = function() { 
    console.log('do stuff to register listeners'); 
    } 

    this.otherFunctionsNotToBeChangedWithDifferentInstances() { 
    console.log('these should not change between different directives') 
    } 

    return $scope.testCtrl = this; 
}); 

app.directive("tester", function() { 
    return { 
    restrict: 'A', 
    controller: 'testCtrl', 
    template: '<button ng-click="testCtrl.save()">save</button>' 

    }; 
}); 

tester 지시어는 거기에 몇 가지 방법이 있지만, 두 지시어가 위치에 따라 변경되거나 사용됩니다 정말 기본적인 예를 들어,의 말을하자 나는이 있습니다. 함수에서 지시어 특성으로 전달할 수 있지만이 작업을 수행하는 더 좋은 방법이 있는지 궁금합니다. 저는 의료기관을 보았습니다. 그러나 어떻게 이들이 심지어 이것에 들어갈 지 확신 할 수 없습니다.

Answer 1

지침에서 testCtrl.save()이 범위에 있다고 가정하는 대신 해당 기능을 속성으로 전달합니다. 다음과 같은 것 : http://jsbin.com/jidizoxi/1/edit

지시어는 my-on-click 속성의 값을 호출 가능 함수로 바인드합니다. 템플릿이 컨트롤러 ctrlOnClick() 함수에서 전달되고 이 myOnClick()이라고 호출되면 템플릿은 서로 바인딩되므로 ctrlOnClick()을 호출합니다.

편집 :

또 다른 일반적인 방법은 지시어로 설정 객체를 전달하는 것입니다.

$scope.directiveConfig = { 
    method1: function() { ... }, 
    method2: function() { ... }, 
    method3: function() { ... }, 
... 
} 

그리고 템플릿 :

scope: { 
    config: '=' 
} 

다음 메소드를 호출 할 수있는 지침 :이 지침은 그때까지 그 객체에 대한 참조를 가져옵니다

<my-directive config="directiveConfig"></my-directive> 

그래서 컨트롤러는 같을 것 다음과 같은 객체에 : $scope.config.method1().