반응형
Angular : &를 사용하여 지시문 링크 함수 내에서 컨트롤러 함수 호출
지시문의 링크 함수에서 앰퍼샌드 '&'를 사용하여 지시문에 전달 된 함수를 호출하는 데 문제가 있습니다.
컨트롤러에서 함수가 호출 된 것 같지만 호출에서 인수가 전달되지 않습니다. 우리가 본 모든 예제는 템플릿에서 호출을 생성하여 전달하는 것과 관련이 있습니다. 템플릿에서 지시문의 함수를 호출 한 다음 지시문에서 전달 된 컨트롤러 함수를 호출하는 작업을 수행하는 방법이 있습니까?
{}
s 내부 의 인수를 전달하고 있습니까? 예를 들어 지시문의 링크 함수 내에서 다음과 같이 메서드를 호출하고 싶을 것입니다.scope.someCtrlFn({arg1: someValue});
<div my-directive callback-fn="ctrlFn(arg1)"></div>
app.directive('myDirective', function() {
return {
scope: { someCtrlFn: '&callbackFn' },
link: function(scope, element, attrs) {
scope.someCtrlFn({arg1: 22});
},
}
});
function MyCtrl($scope) {
$scope.ctrlFn = function(test) {
console.log(test);
}
}
바이올린 .
Mark의 대답 외에도 &
속기를 사용하여 일부 문자를 절약 할 수 있음을 지적하고 싶습니다 . 이것은 callback-fn
당신의 HTML 에서 참조되는 것이 당신 scope.callbackFn
의 범위에 존재 한다고 가정합니다 . 다른 모든 것은 여전히 동일하므로 변경할 줄은 2 개뿐입니다. 나는 Mark의 버전을 주석으로 보관했기 때문에 차이점을 쉽게 발견 할 수있을 것입니다.
<div my-directive callback-fn="ctrlFn(arg1)"></div>
app.directive('myDirective', function() {
return {
scope: { callbackFn: '&' }, //scope: { someCtrlFn: '&callbackFn' },
link: function(scope, element, attrs) {
scope.callbackFn({arg1: 22}); //scope.someCtrlFn({arg1: 22});
},
}
});
function MyCtrl($scope) {
$scope.ctrlFn = function(test) {
console.log(test);
}
}
반응형
'Development Tip' 카테고리의 다른 글
Android에서 DialogFragment의 위치 (0) | 2020.12.02 |
---|---|
동일한 터미널에서 한 번에 병렬 여러 명령 실행 (0) | 2020.12.02 |
모델에 숫자를 사용하는 Angularjs ng-options가 초기 값을 선택하지 않습니다. (0) | 2020.12.02 |
셸 명령의 출력을 버퍼링 해제하는 방법은 무엇입니까? (0) | 2020.12.02 |
내 앱 내에서 Apple Mail 앱을 시작 하시겠습니까? (0) | 2020.12.02 |