两个控制器分别用于主应用和子应用,它们的url与angular ui-route相同

Two controllers for main-app and sub-app with same url with angular ui-route?

本文关键字:应用 url 相同 ui-route angular 控制器 两个 用于      更新时间:2023-09-26

我有两个控制器'BaseController'和'SubController'为主应用程序和子应用程序定义。这两个控制器的配置指向空url。

下面是main-app的配置:-

angular.module("main-app").config(["$stateProvider", "$urlRouterProvider", function ($stateProvider, $urlRouterProvider) {
  $stateProvider
  .state('base', {
      url: "",
      views: {
        "base": {
          controller: 'BaseController' 
        }
      }
    });
}]);

这是子应用的配置:-

 angular.module("sub-app").config(["$stateProvider", "$urlRouterProvider", function ($stateProvider, $urlRouterProvider) {
  //$locationProvider.html5Mode(true); 
  $stateProvider
  .state('sub', {
      url: "",
      views: {
        "patients": {
          templateUrl:"templates/scope/patients/patients_search.html",
          controller: 'PatientsController' 
        }
      },
    });
}]);

主应用包含子应用。

我如何允许加载两个控制器与相同的空url

首先,同一个根视图的两个控制器没有任何意义。这是因为控制器需要一个视图上下文来执行操作,即在$scope层次结构中的位置。

我认为你需要的是将你的控制器抽象成服务,这些服务可以注入到任何控制器中。例如,创建mainsrvsubsrv服务,然后在url: ''上使用单个根控制器。然后你的根控制器定义看起来像这样:

angular.module('myapp', [])
    .controller('AppCtrl', ['mainsrv', 'subsrv', function(mainsrv, subsrv){
        // use mainsrv and subsrv services here
    }]);

如果你真的想在根视图上加载多个控制器,就像上面那样创建一个根视图,但是在视图中使用ng-controller来指定每个控制器的上下文。例如:

<div ng-controller="BaseController"></div>
<div ng-controller="PatientsController"></div>