지시문 사이에 의사 소통하는 방법은 상당히 많습니다. 내부 지시문이 중첩 된 지시문이 있다고 가정하면 내부 지시문이 외부와 통신해야합니다 (예 : 사용자가 선택).
<outer>
<inner></inner>
<inner></inner>
</outer>
지금 까지이 작업을 수행하는 5 가지 방법이 있습니다
require:
부모 지시
inner
지시어는 요구할 수 outer
는 컨트롤러에 대한 몇 가지 방법을 노출시킬 수 지시어. 그래서 inner
정의에서
require: '^outer',
link: function(scope, iElement, iAttrs, outerController) {
// This can be passed to ng-click in the template
$scope.chosen = function() {
outerController.chosen(something);
}
}
그리고 outer
지시문의 컨트롤러에서 :
controller: function($scope) {
this.chosen = function(something) {
}
}
$emit
행사
inner
지시 할 수 $emit
이벤트, outer
지시어를 통해 응답 할 수는 $on
. 에 따라서 inner
지침의 컨트롤러 :
controller: function($scope) {
$scope.chosen = function() {
$scope.$emit('inner::chosen', something);
}
}
과에서 outer
지침 컨트롤러 :
controller: function($scope) {
$scope.$on('inner::chosen, function(e, data) {
}
}
다음을 통해 상위 범위에서 표현식을 실행합니다. &
항목은 부모 범위의 식에 바인딩하여 적절한 시점에서 실행할 수 있습니다. HTML은 다음과 같습니다.
<outer>
<inner inner-choose="functionOnOuter(item)"></inner>
<inner inner-choose="functionOnOuter(item)"></inner>
</outer>
따라서 inner
컨트롤러에는 ‘innerChoose’함수가 있으며
scope: {
'innerChoose': '&'
},
controller: function() {
$scope.click = function() {
$scope.innerChoose({item:something});
}
}
outer
지시문 범위 에서 ‘functionOnOuter’함수를 호출합니다 (이 경우) .
controller: function($scope) {
$scope.functionOnOuter = function(item) {
}
}
격리되지 않은 범위에서 범위 상속
이들은 중첩 컨트롤러이기 때문에 범위 상속이 작동 할 수 있으며 내부 지시문은 격리 된 범위가없는 한 범위 체인의 모든 함수를 호출 할 수 있습니다. 에 따라서 inner
지침 :
// scope: anything but a hash {}
controller: function() {
$scope.click = function() {
$scope.functionOnOuter(something);
}
}
그리고 outer
지시문에서 :
controller: function($scope) {
$scope.functionOnOuter = function(item) {
}
}
내부 및 외부에 주입 된 서비스
서비스는 두 지시문 모두에 삽입 될 수 있으므로 동일한 객체에 직접 액세스하거나 서비스를 알리기 위해 함수를 호출하고 펍 / 서브 시스템에서 알림을 받도록 등록 할 수도 있습니다. 지시문을 중첩 할 필요가 없습니다.
질문 : 서로의 잠재적 인 단점과 장점은 무엇입니까?
답변
&
지시문의 scope: {}
정의를 API로 볼 때 주로 지시문 범위에서 속성 을 정의하는 것이 좋습니다. $emit
주입 된 컨트롤러 내에서 사용되는 ‘d 이벤트, 상속 된 범위 함수 또는 함수에 대한 링크 및 컨트롤러 기능을 검색하는 것보다 지시문이 올바르게 작동해야하는 정보를 확인하기 위해 범위 속성 정의를 보는 것이 훨씬 쉽습니다 .
답변
내 의견 :
서비스는 모듈 / 지시문 / 컨트롤러간에 동작 / 데이터를 공유하는 기본 방법입니다. 지시문은 중첩 될 수있는 분리 된 것입니다. 컨트롤러는 가능한 한 뷰 모델이되어야하며 이상적으로는 비즈니스 로직이 없어야합니다.
그래서:
부모 범위 기능에 액세스하여 함께 배선을 시작하면 너무 강하게 결합하여 전체 응용 프로그램을 읽을 수 없으며 구성 요소를 재사용 할 수 없게 될 위험이 있다고 생각합니다. 서비스에서 공유 데이터 또는 동작을 분리 할 때 런타임에 사용될 서비스를 결정하더라도 다른 데이터 / 동작으로 전체 지시문을 재사용 할 수 있다는 이점이 있습니다. 의존성 주입이 가장 중요합니다.