<div  onclick="window.open(childEpisode.File_URL | fullPath)">
</div>

the fullPath is a pipe that concatenates the domain part to the URL i.e. file_URL which is relative.

but it doesn't work and shows nothing.

If I use it with img enter code herethen it works but i want it the way I have posted above.

working example:

 <img [src]="childEpisode.File_URL | fullPath" [alt]="childEpisode.Name_AR" >

CodePudding user response：

you can implement it like this:

<div  (click)="openMyLink(childEpisode.File_URL | fullPath)">

then in YourComponent.ts file implement the method like this:

openMyLink(link:string){
  window.open(link)
}

CodePudding user response：

Solution:

In html template use Angular Event binding:

<div  (click)="openURL(childEpisode.File_URL)">...</div>

In the Component ts file inject the FullPathPipe class and use it's transform method:

constructor(private fullPathPipe: FullPathPipe) {...}

openURL(url: string) {
  const transformedURL = this.fullPathPipe.transform(url);
  window.open(transformedURL);
}

Note:

• The pipe operator is not allowed within Template statements. https://angular.io/guide/template-statements#syntax
• Template statements cannot refer to anything in the global namespace such as window or document. https://angular.io/guide/template-statements#statement-best-practices