在AngularJS页面上使用来自URL的参数答案

【问题标题】：Use the parameters from URL on the page in AngularJS在AngularJS页面上使用来自URL的参数
【发布时间】：2017-01-09 05:44:34
【问题描述】：

我必须在页面上使用来自 url 的参数。

例如，URL 就像：url.com/index.html?username。我需要将此“用户名”显示在页面上，并多次使用它以获得正确的链接。

<img src='http://url.com/project/{{---username here---}}/{{id}}.png' alt='' />

我已经尝试使用$location.search 来做这件事。但它不起作用。它显示“无法读取未定义的属性搜索”:(( 你能告诉我我做错了什么，我应该如何以正确的方式做？

非常感谢。

【问题讨论】：

您正在使用哪个路由ngRoute 或ui-router？
我认为您应该将值分配给 $scope 变量，然后使用 + 连接它。比如：在控制器 $scope.id = "A1B2C3";并在 viwe url.com/project/'+{{id}}+'.png' alt='' />
您是否在控制器中注入$location 服务？从错误中可以看出$location 没有定义。
@AvneshShakya ngRoute
@MRB 现在我有这样的错误： $location is not defined :(

标签： javascript angularjs url

【解决方案1】：

使用[**$location.search()**][1] 获取params 作为对象。启用 HTML5 模式后尝试。在您的应用配置中，像这样启用HTML5Mode：

$locationProvider.html5Mode(true)

然后，

var params = $location.search();

【讨论】：

【解决方案2】：

如果您需要 URL 中的参数，请像这样使用它

// given URL http://example.com/#/some/path?foo=bar&baz=xoxo
var searchObject = $location.search();
// => {foo: 'bar', baz: 'xoxo'}
searchObject['foo'] //  => 'bar'
searchObject.foo  //  => 'bar'

【讨论】：