2
저는 Angular JS 응용 프로그램 중 일부를 리팩토링하고 있으며 지침에 대해 더 자세히 알아 보겠습니다.서비스 대신 지시기 통신용 컨트롤러를 사용하는 이유
로직을 공유하고 코드를 깨끗하게 정리하려면 컨트롤러를 지시문에 바인딩하는 것이 좋습니다.
controller에서 directive까지 많은 지시어들 사이에 공통적 인 작업을 공유하는 것은 매우 간단하며이 패턴의 흥미를 이해합니다. 하지만 제 질문은 컨트롤러를 사용해야하는 이유입니다.
(this site에서 오는 예제 코드)
패턴 1 : 컨트롤러가 지시 사이의 논리를 공유 할 수
바인딩 controllerdirective에 : 다른 지침을
app.directive("superhero", function() {
return {
restrict: "E",
controller: function ($scope) {
$scope.abilities = [];
// [...] additional methods
this.addFlight = function() {
$scope.abilities.push("flight");
};
},
link: function (scope, element) {
element.addClass("button");
element.bind("mouseenter", function() {
console.log(scope.abilities);
});
}
};
});
공유 논리 :
내 컨트롤러간에 로직을 공유하고 싶을 때 컨트롤러에 내가 입력하는 Factory을 만듭니다. 그런데 왜 같은 패턴을 사용하지 않습니까?
패턴 2 : 공장 지시 사이에 논리를 공유
factory 새로운 선언 :
app.directive("flight", function(myAwesomeFactory) {
return {
require: "superhero",
link: function (scope, element, attrs) {
myAwesomeFactory.addFlight();
}
};
});
나는 이해할 수 없다 : factorydirective에
app.factory("myAwesomeFactory", function() {
return {
addFlight: function() { /* ... */ }
};
});
사용 왜 첫 번째 방법이 두 번째 방법보다 낫다.
보너스 질문 : 왜 지시문에 바인딩 된 컨트롤러에 this 키워드가 사용됩니까?
고마워요. 컨트롤러를 지시문에 바인딩하는 방법에 대한 자습서가 많이 있습니다. 그러나 왜 우리가 이런 식으로해야하는지 설명하는 사람은 아무도 없습니다.