Question

我在控制器内部使用Angular Controller（嵌套控制器）。如何覆盖父控制器中的方法，以便它将调用子方法。例如，在下面的例子中，我希望isShow方法调用isOK方法，它位于第二个控制器（InsideCtrl）

var angularApp = angular.module('ManagerApp', []);

angularApp.controller('MainCtrl', ['$scope', function ($scope) {

    $scope.states = ["NY", "CA", "WA"];
    $scope.isShow=function()
    {
    return $scope.isOK();
    }

    $scope.isOK=function()
    {
    return false;
    }

}]);

angularApp.controller('InsideCtrl', ['$scope', function ($scope) {
    var vm = this;
    vm.states2 = ["NY", "CA", "WA"];

    $scope.isOK=function()
    {
    return true;
    }
}]);

我该怎么做？

Answer 1

当您的父作用域取决于子作用域并了解任何属性或方法时，它的设计很糟糕。我更喜欢这样的解决方案（但它并不理想:)）：

var angularApp = angular.module('ManagerApp', []);

angularApp.controller('MainCtrl', ['$scope', 'defaultStateService', function ($scope, defaultStateService) {
    this.stateService = defaultStateService;

    $scope.states = ["NY", "CA", "WA"];
    $scope.isShow=function(state) {
        return stateService.isOK(state);
    }
}]);

angularApp.controller('InsideCtrl', ['$scope', 'customStateService', function ($scope, customStateService) {
    var vm = this;
    vm.states2 = ["NY", "CA", "WA"];
    $scope.$parent.stateService = customStateService;
}]);

在这种情况下，如果您实施两项服务，ParentController即使没有ChildController也会有效：defaultStateService和customStateService方法{/ 1}}。

Answer 2

您可以使用factory或service来达到此要求。这些可用于在多个控制器之间共享方法，变量或值。

HTML＆amp; CONTROLLERS

var angularApp = angular.module('ManagerApp', []); angularApp.controller('MainCtrl', ['$scope', 'fact', function ($scope, fact) { $scope.states = ["NY", "CA", "WA"]; $scope.isShow=function() { fact.isOK(); } $scope.isOK=function() { return false; } }]); angularApp.factory('fact', function(){ var obj = {}; obj.isOK = function(){ alert("LOGIN"); } return obj; })

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="ManagerApp" ng-controller="MainCtrl"> <button ng-click="isShow()">Click me</button> </div>

角度范围方法覆盖

2 个答案: