AngularJS - 컨트롤러 상속

각도 경로를 사용하고 있는데 두 개의 뷰에서 기본적으로 동일한 데이터를 조작하는 상황이 있습니다. 이제 데이터는 공장을 통해 두 컨트롤러에 제공됩니다. 그러나 기능은 완전히 동일합니다.AngularJS - 컨트롤러 상속

너무 많은 세부 사항을 다루지는 않겠지 만 버튼 클릭 등은 두보기에서 기본적으로 동일하기 때문에 서비스 나 팩토리를 만드는 것은이 문제에서 해결되지 않습니다. 로직이 공장에있을 경우를 제외하고는 동일한 버튼 클릭을 두 번 정의해야합니다. 두 가지 견해의 유일한 차이점은 view2은 view1보다 몇 가지 기능이 더 많습니다. 그렇지 않으면 기본적으로 동일합니다.

내가 지금 필요한 것은 컨트롤러 상속의 일종입니다. 몇 가지 솔루션을 찾았지만 여전히 최적의 솔루션을 찾고 있습니다. 나는 범위를 복제하기 위해 angular.extend을 사용했다. 그러나 이것이 올바른지 확실하지 않다.

$scope$scope에서 $scope의 복제본을 $scope에 view2으로 복제하면 어떻게됩니까? 그것은 재정의됩니까?

다음은 간단한 예제이다 http://jsbin.com/fiqeha/1/edit?html,js,output

출처

2014-12-19 uglycode

당신은 두보기에 동일한 컨트롤러를 사용할 수 있습니까? 그렇지 않으면 두 컨트롤러에 서비스/팩토리를 주입하는 데 어려움을 겪게됩니다. –

당신은 공장으로 기본을 선언하고, 예를 들어 $ 인젝터를 사용하여 컨트롤러로를 주입하여 컨트롤러 상속을 구현할 수

angular.module('app').factory('BaseController', function() { 

    var controller= function($scope){ 

    $scope.value = 0; 

    $scope.testFunction = function() { 
     $scope.value++; 
    }; 

    $scope.overrideFunction = function() { 
     $scope.value--; 
    } 
    } 

    return controller; 
});

와 자식 컨트롤러 ,

angular.module('app').controller('ChildController', function ($scope, 
    $injector, BaseController) { 

    //Inherit base controller - first line in controller 
    $injector.invoke(BaseController, this, {$scope: $scope}); 

    $scope.overrideFunction = function() { 
    //call base function 
    $scope.value = $scope.testFunction() + 2; 
    }; 

});

출처

2014-12-19 21:59:44 Johnny

왜 동일한 컨트롤러를 사용하지? 컨트롤러의 두 인스턴스가 분리되어 원하는 작업을 정확하게 수행 할 수 있습니다.

여기는 fork of your jsbin입니다.

JS :

angular.module('app', []). 
controller('ctrl1', ['$scope', function($scope){ 

    $scope.name = "John"; 

    $scope.displayName = function(){ 
     alert($scope.name); 
    }; 

    $scope.getNameLength = function(){ 
     alert($scope.name.length); 
    }; 

}]);

HTML :

<body> 
    <b>view1.html</b> 
    <div ng-controller="ctrl1"> 
     <input ng-model="name" /> 
     <button ng-click="displayName()">Display</button> 
    </div> 
    <br /> 
    <br /> 
    <b>view2.html</b> 
    <div ng-controller="ctrl1"> 
     <input ng-model="name" /> 
     <button ng-click="displayName()">Display</button> 
     <button ng-click="getNameLength()">Length</button> 
    </div> 
</body>

출처

2014-12-19 12:59:31

그래, 그건 내 초기 솔루션 이었지만 view2에 적어도 다섯 가지 구체적인 방법이 있었기 때문에 정말 엉망이되었다. 그리고 view1도 포함시킬 필요가 없습니다. 내 예제가 잘못 되었나요? – uglycode

그것은 당신에게 도움이되지만, 5 가지의 추가 메소드가 어떤 종류의 상속을 시도 할 강력한 이유가 될 것입니다. 두 개의 다른 컨트롤러를 만들고 일부 메소드를 복사하거나 (복잡한 로직을 서비스로 이동), 2 개의 인스턴스로 동일한 컨트롤러를 사용하십시오. –

답변 해 주셔서 감사합니다. 나는 아직도 원래 게시물의 예제가 좋은 해결책이 아닐 수도 있고 컨트롤러 하나에서 스코프를 복사하여 각도의 규칙을 어기는 이유를 이해하는 데 어려움을 겪고 있습니까? – uglycode

AngularJS - 컨트롤러 상속

답변

관련 문제