Jak uzyskać nazwę domeny dla usługi w Angular2

Question

Potrzebuję zwrócić się do tego samego serwera, api odpoczynku na innym porcie.

Jak mogę to zrobić bez zakodowania nazwy pliku w adresach URL usługi?

Answer 1

Nie ma potrzeby roztworze angular2 specyficzne. Możesz użyć window.location.hostname, aby uzyskać bieżącą nazwę hosta.

Pamiętaj jednak, że jeśli nie chcesz bezpośrednio używać zmiennych globalnych, takich jak window, możesz udostępnić własny obiekt Window, który następnie można wstrzyknąć. Dlatego musisz ustawić dostawcę dla obiektu Window - obiekt podczas ładowania aplikacji.

import {provide} from 'angular2/core'; 
bootstrap(..., [provide(Window, {useValue: window})]); 

Po tym można użyć obiektu okna i dostęp do hosta tak:

constructor(private window: Window) { 
    var hostname = this.window.location.hostname; 
} 

Answer 2

To powinno Ci zacząć:

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

constructor(private locationStrategy:LocationStrategy) { 
    console.log(locationStrategy.prepareExternalUrl('xxx')); 
} 

Answer 3

Inną opcją jest użycie dokumentu z @ kątowej/platformy przeglądarce.

import {DOCUMENT} from '@angular/platform-browser'; 

constructor(@Inject(DOCUMENT) private document) { 
    let url = document.location.protocol +'//'+ document.location.hostname + ':my_port'); 
} 

Answer 4

kątowa 2 najnowszy roztwór roboczy:

app.module.ts

providers: [ 
    {provide: Window, useValue: window}, 
    ... 
] 

youclass.ts

constructor(
    @Inject(Window) private _window: Window 
) { 
    this._baseUrl = `http://${this._window.location.hostname}:3333`; 
}; 

Answer 5

osiągnąłem to z następującego kodu w moim app.component.ts :

import { Component, OnInit, Inject, Injectable } from '@angular/core'; 
import { DOCUMENT } from '@angular/platform-browser'; 

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.scss'] 
}) 
export class AppComponent implements OnInit { 

    constructor(@Inject(DOCUMENT) private document: any) { } 

    ngOnInit() { 
     this.domain = this.document.location.hostname; 
     console.log(this.domain); 
    } 
} 

Powinno to wydrukować nazwę domeny w konsoli.

Answer 6

Polecam używać window.location, jak inni uprzejmie stwierdził.

Jednak, można to zrobić także poprzez importowanie wspólną bibliotekę „siedziba” kanciasty i używając go w iniekcji tak:

import { Injectable } from '@angular/core'; 
import { Location } from '@angular/common'; 
const otherPort = 8000; 

@Injectable() 
export class ServiceOrComponentName { 
    constructor(location: Location) { 
    this.baseUrl = location._platformStrategy._platformLocation._location.protocol + 
     '//' + location._platformStrategy._platformLocation._location.hostname + 
     ':' + otherPort; 
    } 
}