Question

我正在研究如何进行角度路由并将参数传递给控制器。这就是我所做的：

.controller("myController", ["$scope", "$routeParams", function($scope, $routeParams, Units, Tests){
  //Units and Tests are both factories i created to reference within this function.
  var id = $routeParams.id;
  console.log(id);
}]);

当我这样做时，它没有注入＆＃34; $ routeParams＆＃34;进入我的申请。

我查看了angular.js文件，看起来我正在运行： @license AngularJS v1.5.3

这种做法不再是正确的方法吗？我尝试将其更新为：

.controller("myController", ["$scope", "ngRoute", function($scope, ngRoute, Units, Tests){
  // ...
}]);

但似乎也没有正确注射。

我有什么遗失的吗？

目前我正在开发利用AngularJS工具的Ionic Framework。

Answer 1

当处理离子时，如问题中所述，您连接到$stateProvider，因此当您创建状态时，例如：

$stateProvider
  .state("unit", {
    url: "/unit/:id",
    templateUrl: "templates/unit.html",
    controller: "UnitController"
  })

然后你会在控制器中执行：

.controller("myController", ["$scope", 
    "$stateParams", 
    function($scope, $stateParams, Units, Tests){
  var id = $stateParams.id;
  console.log(id);
}]);

这是在Ionic中实现这一目标的方法，因为它在$stateProvider

上利用了$routeProvider

Answer 2

如果您要导航到应用程序中的不同页面，但您还希望应用程序为SPA (Single Page Application)，而不重新加载页面，则可以使用ngRoute模块。

ngRoute模块将您的应用程序路由到不同的页面，而无需重新加载整个应用程序。

var app = angular.module("myApp", ["ngRoute"]);
app.config(function($routeProvider) {
    $routeProvider
    .when("/", {
        templateUrl : "main.html"
    })
    .when("/red", {
        templateUrl : "red.html"
    })
    .when("/green", {
        templateUrl : "green.html"
    })
    .when("/blue", {
        templateUrl : "blue.html"
    });
});

您的应用程序需要一个容器来放置路由提供的内容。

此容器是ng-view directive。

像这样

<div ng-view></div>

您还可以为每个视图定义控制器

var app = angular.module("myApp", ["ngRoute"]);
app.config(function($routeProvider) {
    $routeProvider
    .when("/", {
        templateUrl : "main.html"
    })
    .when("/london", {
        templateUrl : "test.html",
        controller : "myController"
    })

});

routeParams没有注入我的控制器？

2 个答案: