从父视图调用的子控制器中的函数

Question

我有一个设置控制器，负责保存我的网络应用程序的设置。

这个 SettingsController 有一个简单的 $scope.saveSettings 方法。设置控制器与 settings.html 相关联，定义如下：

.config(['$locationProvider','$routeProvider', function ($locationProvider, $routeProvider) {

    $routeProvider.when('/widgets', { templateUrl: 'partials/widgets.html', controller: 'widgetsController'});
    $routeProvider.when('/settings', { templateUrl: 'partials/settings.html', controller:'settingsController' });
    $routeProvider.otherwise({redirectTo: '/widgets'});
}])

如果我想在 settings.html 之外有一个“保存设置”按钮（例如在 main.html 中） 它们没有被调用，因为与主视图关联的主/父控制器对 saveSettings() 一无所知。

这样的事情可以做些什么？

我的 main.html 有
当路由路径为/settings时注入settings.html

Answer 1

您应该将 saveSettings() 放入 Service 并注入所有需要使用 saveSettings() 函数的控制器：

  //define a settingService
    angular.module('myApp').factory('settingsService', function() {  
        return {
            saveSettings: function() { //save settings logic }
        };
    });


function aCtrl($scope, settingsService) {
    settingsService.saveSettings(); // call save settings function that is inside the service
}

function settingsCtrl($scope, theService) {   
        settingsService.saveSettings(); // call save settings function that is inside the service
}

有关服务的更多信息，请阅读HERE。