如何使用AngularJS获得URL参数(How to get the url parameters

2019-06-17 14:20发布

HTML源代码

<div ng-app="">
    <div ng-controller="test">
      <div ng-address-bar browser="html5"></div>
      <br><br>
      $location.url() = {{$location.url()}}<br>
      $location.search() = {{$location.search('keyword')}}<br>
      $location.hash() = {{$location.hash()}}<br>     
      keyword valus is={{loc}} and ={{loc1}}
  </div>
</div>

AngularJS源代码

<script>
function test($scope, $location) {
  $scope.$location = $location;
  $scope.ur = $scope.$location.url('www.html.com/x.html?keyword=test#/x/u');
  $scope.loc1 = $scope.$location.search().keyword ;    
    if($location.url().indexOf('keyword') > -1){    
        $scope.loc= $location.url().split('=')[1];
        $scope.loc = $scope.loc.split("#")[0]        
    }
  }
 </script>

这里变量locloc1都返回测试的结果为上述网址。 这是正确的方法是什么?

Answer 1:

我知道这是一个老问题,但我花了一些时间给稀疏角文档排序了这一点。 该RouteProviderrouteParams是要走的路。 路线线了URL到控制器/视图和routeParams可以传递到控制器。

退房的角度种子项目。 在app.js中,你会找到的路线提供一个例子。 要使用PARAMS只是追加他们是这样的:

$routeProvider.when('/view1/:param1/:param2', {
    templateUrl: 'partials/partial1.html',    
    controller: 'MyCtrl1'
});

然后在您的控制器注入$ routeParams:

.controller('MyCtrl1', ['$scope','$routeParams', function($scope, $routeParams) {
  var param1 = $routeParams.param1;
  var param2 = $routeParams.param2;
  ...
}]);


Answer 2:

虽然路由的确是应用程序级的URL解析一个很好的解决方案,您可能希望使用更低水平$location服务,在自己的服务或控制器注入:

var paramValue = $location.search().myParam; 

这个简单的语法将对工作http://example.com/path?myParam=paramValue 。 但是,只有当你配置了$locationProvider在之前的HTML 5模式:

$locationProvider.html5Mode(true);

否则,看看在http://example.com/#!/path?myParam=someValue “Hashbang”语法是有点复杂,但对旧的浏览器工作的好处(非HTML 5兼容)作为好。



Answer 3:

如果您使用ngRoute,你可以注入$routeParams到控制器中

http://docs.angularjs.org/api/ngRoute/service/$routeParams

如果您使用的角度,用户界面的路由器,你可以注入$stateParams

https://github.com/angular-ui/ui-router/wiki/URL-Routing



Answer 4:

我找到的解决方案如何使用$ location.search(),以获得从URL参数

首先在URL u需要把语法“#”像这样的例子参数之前

"http://www.example.com/page#?key=value"

然后在你的控制器ü把在功能和使用$ location.search()$位置获得URL参数

.controller('yourController', ['$scope', function($scope, $location) {

     var param1 = $location.search().param1; //Get parameter from URL

}]);


Answer 5:

如果已经发布的答案没有帮助,可以用$ location.search()尝试myParam。 对URL 的http://example.domain# myParam = paramValue



文章来源: How to get the url parameters using AngularJS