Angularjs传递查询参数

时间:2016-07-12 20:22:19

标签: javascript angularjs url query-parameters

现在我打电话给代码:

http://localhost:8081/cgi/#/home

它带我到我的主页。

我的app.js是:

angular.module('myModule', 
    ['ngRoute', 'ngCookies', 'ui.bootstrap', 
     'angularUtils.directives.dirPagination'])
.config([ '$routeProvider', function($routeProvider) {

$routeProvider.when('/index', {
    controller : 'homeController',
    templateUrl : './app/views/index.html',
})

.when('/', {
    controller : 'homeController',
    templateUrl : './app/views/home.html'
})

.otherwise({
    redirectTo : '/'
});
}])

现在我需要添加额外的参数“debug”,我可以将它存储在我的控制器中,如果它存在,我需要调用一些函数。

我尝试在下面添加到我的app.js

    .when('/debug', {
    controller : 'homeController',
    templateUrl : './app/views/home.html',
    })

并在我的控制器下面

$scope.debug = $routeParams.debug === 'true' ? true : false;
console.log($scope.debug);

在我的控制器中:

var app = angular.module('myModule');
app.controller('homeController', function($scope, $http, $route) {
    $scope.debug = $routeParams.debug === 'true' ? true : false;
    console.log($scope.debug);
}

另外请包括您认为可以回答的网址,因为我可以从哪里了解从哪里开始寻找routeProvider或$ location功能

但是页面现在已经停止加载了,我也没有任何线索可以让它工作。 请帮忙

1 个答案:

答案 0 :(得分:1)

您需要将$ routeParams服务注入控制器。只需将其作为参数添加到控制器功能中即可。

var app = angular.module('myModule');
app.controller('homeController', function($scope, $http, $route, $routeParams) {
    $scope.debug = $routeParams.debug === 'true' ? true : false;
    console.log($scope.debug);
}

---更新---

路径

使用$location.path() === '/debug'检查当前路径是否为'/ debug'。您需要注入$ location服务。

var app = angular.module('myModule');
app.controller('homeController', function($scope, $http, $route, $location) {
    $scope.debug = $location.path() === '/debug';
    console.log($scope.debug);
}

查询参数

这将允许您检查是否存在键入“debug”且值为“true”的查询参数。

http://localhost:8081/cgi/#/home?debug=true

var app = angular.module('myModule');
app.controller('homeController', function($scope, $http, $route, $location) {
    $scope.debug = $location.search().debug;
    console.log($scope.debug);
}