Location

一个服务,应用可以用它来与浏览器的 URL 互动。

A service that applications can use to interact with a browser's URL.

查看"说明"...

      
      class Location {
  static normalizeQueryParams(params: string): string
  static joinWithSlash(start: string, end: string): string
  static stripTrailingSlash(url: string): string
  path(includeHash: boolean = false): string
  isCurrentPathEqualTo(path: string, query: string = ''): boolean
  normalize(url: string): string
  prepareExternalUrl(url: string): string
  go(path: string, query: string = '', state: any = null): void
  replaceState(path: string, query: string = '', state: any = null): void
  forward(): void
  back(): void
  subscribe(onNext: (value: PopStateEvent) => void, onThrow?: (exception: any) => void, onReturn?: () => void): SubscriptionLike
}
    

说明

这取决于使用了哪个 LocationStrategyLocation 可能会使用 URL 的路径进行持久化,也可能使用 URL 的哈希片段(#)进行持久化。

Depending on which LocationStrategyis used, Location will either persist to the URL's path or the URL's hash segment.

静态方法

给定 URL 参数字符串,如果需要则增加 '?' 前缀,否则原样返回。

Given a string of url parameters, prepend with '?' if needed, otherwise return parameters as is.

static normalizeQueryParams(params: string): string
      
      static normalizeQueryParams(params: string): string
    
参数
params string
返回值

string

给定 url 的两个部分,把它们连接(join)在一起,如有必要则添加一个斜杠。

Given 2 parts of a url, join them with a slash if needed.

static joinWithSlash(start: string, end: string): string
      
      static joinWithSlash(start: string, end: string): string
    
参数
start string
end string
返回值

string

如果 url 具有结尾斜杠,则移除它,否则原样返回。 该方法会查找第一个 #? 之前的结尾 / 字符,之后的则不管。如果 url 中没有 #?,则替换行尾的。

If url has a trailing slash, remove it, otherwise return url as is. This method looks for the first occurrence of either #, ?, or the end of the line as / characters after any of these should not be replaced.

static stripTrailingSlash(url: string): string
      
      static stripTrailingSlash(url: string): string
    
参数
url string
返回值

string

方法

返回标准化之后的 URL 路径

Returns the normalized URL path.

path(includeHash: boolean = false): string
      
      path(includeHash: boolean = false): string
    
参数
includeHash boolean

可选. 默认值是 false.

返回值

string

对指定的路径进行标准化,并和当前的标准化路径进行比较。

Normalizes the given path and compares to the current normalized path.

isCurrentPathEqualTo(path: string, query: string = ''): boolean
      
      isCurrentPathEqualTo(path: string, query: string = ''): boolean
    
参数
path string
query string

可选. 默认值是 ''.

返回值

boolean

给出一个字符串形式的 URL,返回一个标准化的 URL 路径,但不包括首尾的斜杠。

Given a string representing a URL, returns the normalized URL path without leading or trailing slashes.

normalize(url: string): string
      
      normalize(url: string): string
    
参数
url string
返回值

string

给出一个字符串形式的 URL,返回一个平台相关的外部 URL 路径。 如果鬼畜的 URL 不使用前导斜杠('/')开头的,那么该方法就会在标准化之前先添加一个。 如果正在使用 HashLocationStrategy 策略,则该方法还会添加一个 # 符号;如果正在使用 PathLocationStrategy 策略,则添加 APP_BASE_HREF

Given a string representing a URL, returns the platform-specific external URL path. If the given URL doesn't begin with a leading slash ('/'), this method adds one before normalizing. This method will also add a hash if HashLocationStrategy is used, or the APP_BASE_HREF if the PathLocationStrategy is in use.

prepareExternalUrl(url: string): string
      
      prepareExternalUrl(url: string): string
    
参数
url string
返回值

string

把浏览器的 URL 修改为指定 URL 的标准化版本,并往所属平台(如浏览器)的历史堆栈中追加一个新条目。

Changes the browsers URL to the normalized version of the given URL, and pushes a new item onto the platform's history.

go(path: string, query: string = '', state: any = null): void
      
      go(path: string, query: string = '', state: any = null): void
    
参数
path string
query string

可选. 默认值是 ''.

state any

可选. 默认值是 null.

返回值

void

把浏览器的 URL 修改为指定 URL 的标准化版本,并替换所属平台(如浏览器)的历史堆栈的顶部条目。

Changes the browsers URL to the normalized version of the given URL, and replaces the top item on the platform's history stack.

replaceState(path: string, query: string = '', state: any = null): void
      
      replaceState(path: string, query: string = '', state: any = null): void
    
参数
path string
query string

可选. 默认值是 ''.

state any

可选. 默认值是 null.

返回值

void

在所属平台(如浏览器)的历史堆栈中前进一步。

Navigates forward in the platform's history.

forward(): void
      
      forward(): void
    
参数

没有参数。

返回值

void

在所属平台(如浏览器)的历史堆栈中后退一步。

Navigates back in the platform's history.

back(): void
      
      back(): void
    
参数

没有参数。

返回值

void

订阅所属平台(如浏览器)的 popState 事件。

Subscribe to the platform's popState events.

subscribe(onNext: (value: PopStateEvent) => void, onThrow?: (exception: any) => void, onReturn?: () => void): SubscriptionLike
      
      subscribe(onNext: (value: PopStateEvent) => void, onThrow?: (exception: any) => void, onReturn?: () => void): SubscriptionLike
    
参数
onNext (value: PopStateEvent) => void
onThrow (exception: any) => void

可选. 默认值是 undefined.

onReturn () => void

可选. 默认值是 undefined.

返回值

SubscriptionLike

使用说明

最好使用 Router服务来触发路由变更。只有当你要在路由体系之外创建规范化 URL 或与之交互时才会用到 Location

It's better to use Routerservice to trigger route changes. Use Location only if you need to interact with or create normalized URLs outside of routing.

Location 负责基于应用的基地址(base href)对 URL 进行标准化。 所谓标准化的 URL 就是一个从主机(host)开始算的绝对地址,包括应用的基地址,但不包括结尾的斜杠:

Location is responsible for normalizing the URL against the application's base href. A normalized URL is absolute from the URL host, includes the application's base href, and has no trailing slash:

  • /my/app/user/123 是标准化的

    /my/app/user/123 is normalized

  • my/app/user/123 不是标准化的

    my/app/user/123 is not normalized

  • /my/app/user/123/ 不是标准化的

    /my/app/user/123/ is not normalized

Example

import {Location, LocationStrategy, PathLocationStrategy} from '@angular/common'; import {Component} from '@angular/core'; @Component({ selector: 'path-location', providers: [Location, {provide: LocationStrategy, useClass: PathLocationStrategy}], template: ` <h1>PathLocationStrategy</h1> Current URL is: <code>{{location.path()}}</code><br> Normalize: <code>/foo/bar/</code> is: <code>{{location.normalize('foo/bar')}}</code><br> ` }) export class PathLocationComponent { location: Location; constructor(location: Location) { this.location = location; } }
      
      
  1. import {Location, LocationStrategy, PathLocationStrategy} from '@angular/common';
  2. import {Component} from '@angular/core';
  3.  
  4. @Component({
  5. selector: 'path-location',
  6. providers: [Location, {provide: LocationStrategy, useClass: PathLocationStrategy}],
  7. template: `
  8. <h1>PathLocationStrategy</h1>
  9. Current URL is: <code>{{location.path()}}</code><br>
  10. Normalize: <code>/foo/bar/</code> is: <code>{{location.normalize('foo/bar')}}</code><br>
  11. `
  12. })
  13. export class PathLocationComponent {
  14. location: Location;
  15. constructor(location: Location) { this.location = location; }
  16. }