javascript - AngularJS 继承 - 覆盖 $scope.method()

Question

我有一个 ParentController 和一个 ChildController，它们看起来像这样:

父 Controller :

app.controller("ParentController", function($scope) {

    // define preload method, expose to template
    $scope.preload = function() {
        console.log("parent");
    };

    // call preload function
    $scope.preload();
});

子 Controller :

app.controller("ChildController", function($scope) {
    $controller("ParentController", {
        $scope: $scope,
    });

    // override preload method here
    $scope.preload = function() {
        console.log("child")
    };
});

如您所见，两个 Controller 都定义了 $scope.preload()，它在 ParentController 实例化时调用。我的目标是让 ChildController 覆盖此方法，以便在调用它时将不同的字符串记录到控制台。

这可能吗？如果不是，我还能如何在我的 ChildController 中重用 ParentController 中定义的所有方法？

Answer 1

要在独立 Controller 之间共享数据，可以使用服务。使用需要共享的数据模型创建服务。在各自的 Controller 中注入(inject)服务。

在下面的示例中，Service 用于存储变量 x。独立 Controller 将在需要时检查 X 的值。

angular.module('myApp', [])
    .service('myService', function () {
        var x=5 ;
        return {
            increase : function() {
                x++;
            },
            getX : function() {
                return x;
            }
       };
    })

function ControllerA($scope, myService) {
    $scope.x = 1;
    $scope.incrementDataInService= function() {
        myService.increase();
    }
    $scope.syncDataWithService= function() {
        $scope.x = myService.getX();
    }        
}

function ControllerB($scope, myService) {
   $scope.x = 1;
    $scope.incrementDataInService= function() {
        myService.increase();            
    }
    $scope.syncDataWithService= function() {
        $scope.x = myService.getX();
    }    
}​