在 Angular 中，$location 是一个非常重要的服务，它提供了一种方便的方式来获取和操作当前页面的 URL。在本文中，我们将深入探讨 $location 的各种用法，并提供一些示例代码来帮助您更好地理解它的工作原理。
$location 的基本用法
$location 服务可以通过注入 $locationProvider 来获得，如下所示：
angular.module('myApp', [])
.controller('MyController', ['$location', function($location) {
// 在这里使用 $location 服务
}]);一旦我们获得了 $location 服务，我们就可以开始使用它了。下面是 $location 服务的一些基本用法：
获取当前 URL
要获取当前页面的 URL，我们可以使用 $location.absUrl() 方法，如下所示：
var url = $location.absUrl(); console.log(url);
获取当前路径
要获取当前页面的路径，我们可以使用 $location.path() 方法，如下所示：
var path = $location.path(); console.log(path);
获取当前查询参数
要获取当前页面的查询参数，我们可以使用 $location.search() 方法，如下所示：
var params = $location.search(); console.log(params);
获取当前 hash 值
要获取当前页面的 hash 值，我们可以使用 $location.hash() 方法，如下所示：
var hash = $location.hash(); console.log(hash);
修改 URL
要修改当前页面的 URL，我们可以使用 $location 方法，如下所示：
$location.path('/new/path');这将把当前页面的路径修改为 /new/path。
修改查询参数
要修改当前页面的查询参数，我们可以使用 $location.search() 方法，如下所示：
$location.search('key', 'value');这将把当前页面的查询参数修改为 key=value。
修改 hash 值
要修改当前页面的 hash 值，我们可以使用 $location.hash() 方法，如下所示：
$location.hash('newHash');这将把当前页面的 hash 值修改为 newHash。
$location 的高级用法
除了上面的基本用法之外，$location 还有一些高级用法，可以帮助我们更好地操作 URL。下面是 $location 的一些高级用法：
获取 URL 中的参数
如果我们想要获取 URL 中的某个参数，我们可以使用 $location.search() 方法，如下所示：
var paramValue = $location.search().paramName; console.log(paramValue);
监听 URL 的变化
如果我们想要在 URL 变化时执行一些操作，我们可以使用 $locationChangeStart 和 $locationChangeSuccess 事件。$locationChangeStart 事件会在 URL 发生变化之前触发，而 $locationChangeSuccess 事件会在 URL 发生变化之后触发。下面是一个示例：
$scope.$on('$locationChangeStart', function(event, next, current) {
// 在 URL 变化之前执行一些操作
});
$scope.$on('$locationChangeSuccess', function(event, next, current) {
// 在 URL 变化之后执行一些操作
});重定向到另一个 URL
如果我们想要重定向到另一个 URL，我们可以使用 $location.url() 方法，如下所示：
$location.url('/new/url');这将会重定向到 /new/url。
总结
$location 是 Angular 中一个非常重要的服务，它提供了一种方便的方式来获取和操作当前页面的 URL。在本文中，我们深入探讨了 $location 的各种用法，并提供了一些示例代码来帮助您更好地理解它的工作原理。希望这篇文章能够对您有所帮助，让您在开发 Angular 应用时更加得心应手！
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/655eeeefd2f5e1655d9111c7