So erstellen Sie einen Link zu externen URL in Angular 2

Question

Ich bin neu in Angular. Ich beginne mit ver. 2.
Ich muss auf eine file://... URL verlinken. Ich habe versucht, normalen href:

Hinweis: app ist ein Modellobjekt der Bahn, die mit Anwendungen befasst.

<a target="_blank" href="file://{{app.outputPath}}/index.html">no link here</a>. 

das nicht funktioniert - die Verbindung ist, mit der richtigen URL, aber Angular scheint irgendwie um das Ereignis zu blockieren. Warum?

So habe ich ng-href gesehen, aber das ist für Angular 1.x. Und there's no *ngHref von dem, was ich sagen kann. So war dies nur ein naiver Versuch:

<a target="_blank" *ngHref="file://{{app.outputPath}}/index.html">over a directive</a>. 

Auch habe ich gesehen, etwas mit Routing, aber das scheint nur innerhalb der Anwendung für interne Links bestimmt werden:

<a [router-link]="['/staticReport', {path: app.outputPath}]">see the report</a>. 

app.component.ts:

@RouteConfig([ 
    ... 
    {path:"/staticReport/:path", redirectTo: 'file:// ???? ' } 
]) 

Wie kann man eine externe Verbindung erstellen?

Answer 1

Ich nehme an, app ist async zugewiesen. Sie können mit der Elvis operator dieses Problem umgehen:

<a target="_blank" href="file://{{app?.outputPath}}/index.html">no link here</a>. 

nicht die Bindung zu brechen, wenn Angular versucht es zu lösen, bevor app tatsächlich einen Wert hat.

Original- Dieses zum Beispiel arbeitete:

@Component({ 
    selector: 'my-app', 
    template: ` 
    <h2>Hello {{name}}</h2> 
    <a target="_blank" [href]="'file://' + outputPath + '/index.html'">no link here</a> 
` 
}) 
export class App { 
    outputPath:string = 'www.google.com'; 

    constructor() { 
    this.name = 'Angular2'; 
    } 
} 

Eigentlich Ihr erstes Beispiel funktioniert auch

<a target="_blank" href="file://{{outputPath}}/index.html">no link here</a> 

Plunker