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;

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

2 个答案: