Angular 1 - 获取当前 URL 的参数

在前端开发中，获取 URL 中的参数非常常见。本文将介绍如何使用 Angular 1 获取当前 URL 的参数，并提供示例代码。

什么是 URL 参数？

URL（Uniform Resource Locator）参数指的是在 URL 中包含的键值对。例如，在以下 URL 中，id 和 sort 就是 URL 参数：

https://example.com/products?page=2&id=123&sort=price

如何获取 URL 参数？

我们可以从 $location.search() 对象中获取 URL 参数。这个对象返回一个键值对对象，其中键是参数名，值是参数值。

以下是获取 id 参数的示例代码：

app.controller('myController', function($scope, $location) {
  var id = $location.search().id;
  console.log(id);
});

如果 URL 中没有指定参数，则 $location.search() 返回空对象 {}。

处理默认值

在某些情况下，可能需要处理 URL 参数不存在时的默认值。我们可以使用 JavaScript 中的逻辑运算符来实现这一点。

以下是获取 page 参数并处理默认值的示例代码：

app.controller('myController', function($scope, $location) {
  var page = $location.search().page || 1; // 如果 page 参数不存在，则设置默认值为 1
  console.log(page);
});

结论

在本文中，我们学习了如何使用 Angular 1 获取当前 URL 的参数。通过使用 $location.search() 对象，我们可以轻松地获取 URL 参数，并在需要时处理默认值。这对于开发基于 URL 参数的交互式应用程序非常有用。

参考资料

• AngularJS $location Service

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/26921