Angular URL short domain

Question

how can i keep only the domain name in the url browser, example :https://stackoverflow.com/ThunderRoid → stackoverflow.com I create a short-domain.pipe, Can i use pipe with routing application? can someone help me please,I am blocked

@Pipe({
      name: 'shortDomain'
    })
    export class shortDomain implements PipeTransform {
      transform(url: string, args?: any): any {
        if (url) {
          if (url.length > 3) {
            let result;
            let match;
            if (match = url.match(/^(?:https?:\/\/)?(?:www\.)?([^:\/\n?=]+)/im)) {
              result = match[1];
              if (match = result.match(/^[^.]+\.(.+\..+)$/))
                result = match[1];
            }
            return result;
          }
          return url;
        }
        return url;
      }
    }

Answer 1

From your example:

<a [href]="dog.source">{{dog.source}}</a>

to

<a [href]="dog.source">{{dog.source | shortDomain}}</a>

Keep the href in the a Tag the same just add the pipe to the interpolation ({{ }})