Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

251
Views
How to use angular pipes in window.open with url?
<div class="member-img" 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" class="member-thumnail img-fluid">
about 4 years ago · Santiago Trujillo
2 answers
Answer question

0

you can implement it like this:

<div class="member-img" (click)="openMyLink(childEpisode.File_URL | fullPath)">

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

openMyLink(link:string){
  window.open(link)
}
about 4 years ago · Santiago Trujillo Report

0

Solution:

In html template use Angular Event binding:

<div class="member-img" (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
about 4 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!