将控制器的公共部分分离成一个公共控制器

Question

我正在使用 AngularJS 和 uiRouter 开发网络应用程序。我开发了我的路线配置如下：

(function () {

    'use strict';

    var module = angular.module('app', ['ngMaterial', 'ui.router']);

    function Config($urlRouterProvider, $stateProvider) {
        $urlRouterProvider.otherwise('/');

        $stateProvider.state('Home', {
            url: '/',
            templateUrl: 'Partials/homeview.html',
            controller: 'homeCtrl'
        }).state('Table', {
            url: '/tableview',
            templateUrl: 'Partials/tableview.html',
            controller: 'tableCtrl'
        }).state('List', {
            url: '/listview',
            templateUrl: 'Partials/listview.html',
            controller: 'listCtrl'
        }).state('New', {
            url: '/new',
            templateUrl: 'Partials/new.html',
            controller: 'newCtrl'
        }).state('Edit', {
            url: '/edit/:index',
            templateUrl: 'Partials/edit.html',
            controller: 'editCtrl'
        });
    }
    Config.$inject = ["$urlRouterProvider", "$stateProvider"];

    module.config(Config);
}());

某些控制器传递给视图的代码是重复的，所以我想知道是否有办法同时将 2 个控制器传递给视图，或者是否有办法创建一个将文件与复制控制器的特定部分分开，并将其作为依赖注入传递到所需的控制器中。

Answer 1

您不能将两个控制器链接到一个 uiRouter 路由。但是您当然可以创建包含您的通用功能的服务或工厂。（有关更多研究，请参阅 angular.service vs angular.factory。）

var app = angular.module('app',[])
app.service('myFunctions',function() {
  this.addNumbers = function(a,b) {
    // calculate some stuff
    return a+b;
  }
}
app.controller('myController',function(myFunctions){
  myFunctions.addNumbers(2,2); // 4
})

将控制器的公共部分分离成一个公共控制器

Separate common parts of controller into a common controller

routing

controllers

angularjs

angular-ui-router