Question

我有多个调用同一个Controller的路由，我想将不同的变量传递给它。

// Example
$routeProvider.
  when('/a', {
    templateUrl: 'test.html',
    controller: 'MyController' // should get passed 'exampleA'
  }).
  when('/b', {
    templateUrl: 'test.html',
    controller: 'MyController' // should get passed 'exampleB'
});

我知道我可以使用“resolve”对象：

$routeProvider.
  when('/a', {
    templateUrl: 'test.html',
    controller: 'MyController',
    resolve: {test: function() { return true; }}
});

将值作为依赖项传递：

app.controller('MyController', ['$scope', 'test', function ($scope, test) {
  console.log(test); // true
}

我的问题是我的应用程序崩溃，如果在其他路由上缺少resolve对象，我想传递可选参数。

有没有办法将特定的参数传递给Controller（来自路由提供商）？

谢谢

Answer 1

路由：

$routeProvider.
  when('/a', {
    templateUrl: 'test.html',
    controller: 'MyController',
    paramExample: 'exampleA'
  }).
  when('/b', {
    templateUrl: 'test.html',
    controller: 'MyController',
    paramExample: 'exampleB'
});

访问：在您的控制器中注入$ route然后使用此

 app.controller('MyController', ['$scope', '$route', function ($scope, $route) {
      var paramValue = $route.current.$$route.paramExample;
      console.log(paramValue); 
 }

Answer 2

您可以使用resolve和$route.currrent.params.test传递参数，如下所示：

$routeProvider
  .when('/a', {
    templateUrl: 'view.html',
    controller: 'MainCtrl',
    resolve: {
        test: function ($route) { $route.current.params.test = true; }
    }
  })
  .when('/b', {
    templateUrl: 'view.html',
    controller: 'MainCtrl',
    resolve: {
        test: function ($route) { $route.current.params.test = false; }
    }
  })

然后在您的控制器中，您可以从$ routeParams访问它：

app.controller('MainCtrl', function($scope, $routeParams) {
  $scope.test = $routeParams.test;
})

http://plnkr.co/edit/ct1ZUI9DNqSZ7S9OZJdO?p=preview

Answer 3

执行此操作最自然的方法是执行您希望加载包含参数的页面时通常执行的操作：使用查询参数：http://yoururl.com?param1=value&param2=value

ngRoute附带了服务$ routeParams，您可以在控制器中注入该服务。现在，您只需检索此$routeParams.param1。

之类的值

另一种方法是使用$location.path检索路径并在那里设置变量。

Answer 4

使用$ routeParams

主要js文件中的

routeApp.config(function($routeProvider) {
$routeProvider
    .when('/home', {
        templateUrl: '../sites/./home.html',
        controller: 'StudentController'
    })
    .when('/viewStudents/:param1/:param2', {
        templateUrl: '../sites/./viewStudents.html',
        controller: 'StudentController'
    })
    .otherwise({
        redirectTo: '/'
    });
 });

 routeApp.controller('StudentController',['$filter','$routeParams', '$location',function($filter,$routeParams,$location){
   var StudentCtrl = this;  
   StudentCtrl.param1 = $routeParams.param1;
   StudentCtrl.param2 = $routeParams.param2;
 }]);

从Home.html调用

 <div class="container">
   <h2> Welcome </h2>
   <a href="#/viewStudents/myname/somevalue2">Students</a>
</div>

Angular：将$ routeProvider中的参数传递给控制器

4 个答案: