Angular 1.4 - 在 $routeProvider 中重用相同的控制器

Question

我尝试使用 $routeProvider 在完整视图和移动视图上使用相同的控制器。下面的代码不能开箱即用。我错过了什么？

我也可以使用另一个想法 - 相同的控制器，但基于用户代理的不同templateUrl。我可以这样做吗？

   $routeProvider
        .when("/details/:id", {
            templateUrl: "views/details.html",
            controller: "detailsController"
        })
        .when("/mdetails/:id", {
            templateUrl:  "views/mobiledetails.html",
            controller: "detailsController"
        })

}])

Answer 1

您可以使用 2 个共享相同功能（控制器逻辑）的不同控制器，或者使用 2 个使用各自功能但与内部所有逻辑共享服务的不同控制器。

以下是第一种情况的示例：

angular.module('FunnyAnt.Examples.Routing', ['ngRoute']);

function sharedController($scope) {
  $scope.name = "Shared";
}

angular.module('FunnyAnt.Examples.Routing')
  .controller('HomeController', sharedController);

angular.module('FunnyAnt.Examples.Routing')
  .controller('AboutController', sharedController);

angular.module('FunnyAnt.Examples.Routing')
  .config(function($routeProvider) {
    $routeProvider.
    when('/home', {
      templateUrl: 'embedded.home.html',
      controller: 'HomeController'
    }).
    when('/about', {
      templateUrl: 'embedded.about.html',
      controller: 'AboutController'
    }).
    otherwise({
      redirectTo: '/home'
    });
  });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.2/angular-route.js"></script>

<div ng-app="FunnyAnt.Examples.Routing">

  <script type="text/ng-template" id="embedded.home.html">
    <h1> Home: {{ name }} </h1>
  </script>

  <script type="text/ng-template" id="embedded.about.html">
    <h1> About: {{ name }} </h1>
  </script>

  <div id="navigation">
    <a href="#/home">Home</a>
    <a href="#/about">About</a>
  </div>

  <div ng-view></div>
</div>

Answer 2

我不知道发生了什么，但一切正常。

  $routeProvider
        .when("/details/:id", {
            templateUrl: "views/details.html",
            controller: "detailsController"
        })
        .when("/mdetails/:id", {
            templateUrl:  "views/mobiledetails.html",
            controller: "detailsController"
        })

}])

在控制器内部，我将变量设置为移动（ism），我将其用于额外的逻辑

$scope.ism = $location.path().indexOf('/mflights') === 0;