Question

AngularJs 用 location 设置和判断在哪个页面

Answer 1

直接看官网的例子吧

1>首先：这是Getter and setter 方法的使用。
// get the current path
$location.path();

// change the path
$location.path('/newValue')
也可以变形使用啦~
//Change multiple segments in one go, chain setters like this:

$location.path('/newValue').search({key: value});
2>Replace method(中文可能翻译成替代方法)
即，把原来的位置替换成别的
$location.path('/someNewPath');
$location.replace();
// or you can chain these as: $location.path('/someNewPath').replace();
3>对比window.location(必须有图有真相是吧，上图)

。。。。我懒得翻译了术语太多。。总之功能很强就对了。
4>什么时候需要用到$ location呐？

Any time your application needs to react to a change in the current URL or if you want to change the current URL in the browser.

（任何时间当你的应用在现在的URL上需要改变和跳转的时候，或者你需要改变现在浏览器中的URL时候-----TnT，英语烂请见谅）

5>还有一个特性一定要介绍（上图）

这个。。。我暂时也不太懂，欢迎看了这篇文章而且懂的人来给我解答啦~ （此处应该有掌声~）

6>最后的最后一定是小例子啦~加深一下记忆吧~

Browser in HTML5 Fallback mode (Hashbang mode)

(1)index.html
<div ng-controller="LocationController">
<div ng-address-bar></div><br><br>
<div>
$location.protocol() = <span ng-bind="$location.protocol()"></span> <br>
$location.host() = <span ng-bind="$location.host()"></span> <br>
$location.port() = <span ng-bind="$location.port()"></span> <br>
$location.path() = <span ng-bind="$location.path()"></span> <br>
$location.search() = <span ng-bind="$location.search()"></span> <br>
$location.hash() = <span ng-bind="$location.hash()"></span> <br>
</div>
<div id="navigation">
<a href="http://www.example.com/base/first?a=b">/base/first?a=b</a> |
<a href="http://www.example.com/base/sec/ond?flag#hash">sec/ond?flag#hash</a> |
<a href="/other-base/another?search">external</a>
</div>
</div>
(2)app.js
angular.module('hashbang-mode', ['fake-browser', 'address-bar'])

.constant('initUrl', 'http://www.example.com/base/index.html#!/path?a=b#h')
.constant('baseHref', '/base/index.html')
.value('$sniffer', { history: false })

.config(function($locationProvider) {
$locationProvider.html5Mode(true).hashPrefix('!');
})

.controller("LocationController", function($scope, $location) {
$scope.$location = {};
angular.forEach("protocol host port path search hash".split(" "), function(method){
$scope.$location[method] = function(){
var result = $location[method].call($location);
return angular.isObject(result) ? angular.toJson(result) : result;
};
});
})

.run(function($rootElement) {
$rootElement.on('click', function(e) {
e.stopPropagation();
});
});

3 )FakeBrowser.js

angular.module('fake-browser', [])

.config(function($provide) {
$provide.decorator('$browser', function($delegate, baseHref, initUrl) {

$delegate.onUrlChange = function(fn) {
this.urlChange = fn;
};

$delegate.url = function() {
return initUrl;
};

$delegate.defer = function(fn, delay) {
setTimeout(function() { fn(); }, delay || 0);
};

$delegate.baseHref = function() {
return baseHref;
};

return $delegate;
});
});

4 )addressBar.js
angular.module('address-bar', [])
.directive('ngAddressBar', function($browser, $timeout) {
return {
template: 'Address: <input id="addressBar" type="text" style="width: 400px" >',
link: function(scope, element, attrs){
var input = element.children("input"), delay;

input.on('keypress keyup keydown', function(event) {
delay = (!delay ? $timeout(fireUrlChange, 250) : null);
event.stopPropagation();
})
.val($browser.url());

$browser.url = function(url) {
return url ? input.val(url) : input.val();
};

function fireUrlChange() {
delay = null;
$browser.urlChange(input.val());
}
}
};
});

5
)protractor.js(测试JS)
it("should show fake browser info on load", function(){
expect(addressBar.getAttribute('value')).toBe(url);

expect(element(by.binding('$location.protocol()')).getText()).toBe('http');
expect(element(by.binding('$location.host()')).getText()).toBe('www.example.com');
expect(element(by.binding('$location.port()')).getText()).toBe('80');
expect(element(by.binding('$location.path()')).getText()).toBe('/path');
expect(element(by.binding('$location.search()')).getText()).toBe('{"a":"b"}');
expect(element(by.binding('$location.hash()')).getText()).toBe('h');

});

it("should change $location accordingly", function(){
var navigation = element.all(by.css("#navigation a"));

navigation.get(0).click();

expect(addressBar.getAttribute('value')).toBe("http://www.example.com/base/index.html#!/first?a=b");

expect(element(by.binding('$location.protocol()')).getText()).toBe('http');
expect(element(by.binding('$location.host()')).getText()).toBe('www.example.com');
expect(element(by.binding('$location.port()')).getText()).toBe('80');
expect(element(by.binding('$location.path()')).getText()).toBe('/first');
expect(element(by.binding('$location.search()')).getText()).toBe('{"a":"b"}');
expect(element(by.binding('$location.hash()')).getText()).toBe('');

navigation.get(1).click();

expect(addressBar.getAttribute('value')).toBe("http://www.example.com/base/index.html#!/sec/ond?flag#hash");

expect(element(by.binding('$location.protocol()')).getText()).toBe('http');
expect(element(by.binding('$location.host()')).getText()).toBe('www.example.com');
expect(element(by.binding('$location.port()')).getText()).toBe('80');
expect(element(by.binding('$location.path()')).getText()).toBe('/sec/ond');
expect(element(by.binding('$location.search()')).getText()).toBe('{"flag":true}');
expect(element(by.binding('$location.hash()')).getText()).toBe('hash');

});

Answer 2

1>首先：这是Getter and setter 方法的使用。
// get the current path
$location.path();

// change the path
$location.path('/newValue')

也可以变形使用啦~
//Change multiple segments in one go, chain setters like this:

$location.path('/newValue').search({key: value});

2>Replace method(中文可能翻译成替代方法)
即，把原来的位置替换成别的
$location.path('/someNewPath');
$location.replace();
// or you can chain these as: $location.path('/someNewPath').replace();

3>对比window.location(必须有图有真相是吧，上图)

。。。。我懒得翻译了术语太多。。总之功能很强就对了。
4>什么时候需要用到$ location呐？
Any time your application needs to react to a change in the current URL or if you want to change the current URL in the browser.