web-dev-qa-db-fra.com

Comment obtenir une URL absolue par un nom de route dans Angular 2?

Dans mon application Angualar 2 (finale), j'ai souvent besoin de créer une URL complète (absolue) à l'aide d'un nom de route (comme "/ products"), par exemple. fournir un lien permanent vers une page spécifique ou ouvrir une page à partir d'un composant dans un autre onglet/fenêtre.

Existe-t-il une API Angular 2 permettant d'obtenir une URL absolue par un nom de route? Si non, existe-t-il des solutions connues, par exemple en utilisant javascript?

J'ai essayé location ou PathLocationStrategy (par exemple, prepareExternalUrl), mais la méthode renvoie "/ products" au lieu de, par exemple. http: // localhost/products

javascriptangularangular2-routing
9
Alexander Zwitbaum

Vous pouvez utiliser PlatformLocation pour obtenir base_url, puis concaténer avec le retour de prepareExternalUrl:

    import { PlatformLocation } from '@angular/common';

    export class MyComponent {
        constructor(
            private platformLocation: PlatformLocation
        ){
            this.logAppStart(platformLocation);
        }

        private logAppStart(platformLocation: any){ // CHANGED THE TYPE TO ANY TO BE ABLE TO ACCESS THE LOCATION PROPERTY
            console.log(platformLocation.location); // HERE YOU FIND WHAT YOU NEED
        }
    }

Trouvé ici

3
Bruno João
import { Router } from '@angular/router';

[...]

constructor(private router: Router) { 
  let absoluteUrl = window.location.Origin + this.router.createUrlTree(['/products']);
}
0
Saman Mohamadi

La réponse acceptée peut avoir un problème lorsque votre emplacement actuel est le chemin racine. (CurrentRelativeUrl == '/')..____. Je suggérerais cette amélioration par rapport à la réponse acceptée:

import { Router } from '@angular/router';
[...]

constructor(private _router: Router) { }

  redirectNewWindow() {    
  const internalUrl = '/products';

  // Resolve the base url as the full absolute url subtract the relative url.
  var currentAbsoluteUrl = window.location.href;
  var currentRelativeUrl = this._router.url;
  var baseUrl = currentAbsoluteUrl.substring(0, currentAbsoluteUrl.length - currentRelativeUrl.length);

  // Concatenate the urls to construct the desired absolute url.
  window.open(baseUrl + internalUrl, '_blank');
}
0
Roman