This is the archived documentation for Angular v5. Please visit angular.io to see documentation for the current version of Angular.

PathLocationStrategy

npm Package @angular/common
Module import { PathLocationStrategy } from '@angular/common';
Source common/src/location/path_location_strategy.ts

Use URL for storing application location data.

Overview

      
      class PathLocationStrategy extends LocationStrategy {
  constructor(_platformLocation: PlatformLocation, href?: string)
  onPopState(fn: LocationChangeListener): void
  getBaseHref(): string
  prepareExternalUrl(internal: string): string
  path(includeHash: boolean = false): string
  pushState(state: any, title: string, url: string, queryParams: string)
  replaceState(state: any, title: string, url: string, queryParams: string)
  forward(): void
  back(): void
  // inherited from common/LocationStrategy
  path(includeHash?: boolean): string
  prepareExternalUrl(internal: string): string
  pushState(state: any, title: string, url: string, queryParams: string): void
  replaceState(state: any, title: string, url: string, queryParams: string): void
  forward(): void
  back(): void
  onPopState(fn: LocationChangeListener): void
  getBaseHref(): string
}
    

Description

PathLocationStrategy is a LocationStrategy used to configure the Location service to represent its state in the path of the browser's URL.

If you're using PathLocationStrategy, you must provide a APP_BASE_HREF or add a base element to the document. This URL prefix that will be preserved when generating and recognizing URLs.

For instance, if you provide an APP_BASE_HREF of '/my/app' and call location.go('/foo'), the browser's URL will become example.com/my/app/foo.

Similarly, if you add <base href='/my/app'/> to the document and call location.go('/foo'), the browser's URL will become example.com/my/app/foo.

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; }
}
    

Constructor

      
      constructor(_platformLocation: PlatformLocation, href?: string)
    

Members

      
      onPopState(fn: LocationChangeListener): void
    

      
      getBaseHref(): string
    

      
      prepareExternalUrl(internal: string): string
    

      
      path(includeHash: boolean = false): string
    

      
      pushState(state: any, title: string, url: string, queryParams: string)
    

      
      replaceState(state: any, title: string, url: string, queryParams: string)
    

      
      forward(): void
    

      
      back(): void
    

Annotations

      
      @Injectable()