热门面试题与答案和在线测试
面向面试准备、在线测试、教程与实战练习的学习平台

通过聚焦学习路径、模拟测试和面试实战内容持续提升技能。

WithoutBook 将分主题面试题、在线练习测试、教程和对比指南整合到一个响应式学习空间中。

面试准备

Angular 面试题与答案

相关差异对比

相关差异对比

Jquery vs AngularJSAngularJS vs NodeJSAngularJS vs Angular
Angular vs React

问题 31. What is a parameterized pipe in Angular?

A pipe can accept any number of optional parameters to fine-tune its output. The parameterized pipe can be created by declaring the pipe name with a colon ( : ) and then the parameter value. If the pipe accepts multiple parameters, separate the values with colons. Let's take a birthday example with a particular format(dd/MM/yyyy):

import { Component } from '@angular/core';

  @Component({

  selector: 'app-birthday',

  template: `<p>Birthday is {{ birthday | date:'dd/MM/yyyy'}}</p>` // 14/07/1986 

})

export class BirthdayComponent {

  birthday = new Date(1986, 7, 14);

}

这有帮助吗? 添加评论 查看评论
 

问题 32. How do you chain pipes in Angular?

You can chain pipes together in potentially useful combinations as per the needs. Let's take a birthday property which uses date pipe(along with parameter) and uppercase pipes as below

import { Component } from '@angular/core';

  @Component({

  selector: 'app-birthday',

  template: `<p>Birthday is {{ birthday | date:'fullDate' | uppercase}} </p>` // SUNDAY, JUNE 14, 1986 })

  export class BirthdayComponent {

  birthday = new Date(1986, 7, 14);

  }

这有帮助吗? 添加评论 查看评论
 

问题 33. What is a custom pipe in Angular?

Apart from built-inn pipes, you can write your own custom pipe with the below key characteristics,

  1. A pipe is a class decorated with pipe metadata @Pipe decorator, which you import from the core Angular library For example,

    @Pipe({name: 'myCustomPipe'})

  2. The pipe class implements the PipeTransform interface's transform method that accepts an input value followed by optional parameters and returns the transformed value. The structure of pipeTransform would be as below,

    interface PipeTransform {

      transform(value: any, ...args: any[]): any

    }

  3. The @Pipe decorator allows you to define the pipe name that you'll use within template expressions. It must be a valid JavaScript identifier.

    template: `{{someInputValue | myCustomPipe: someOtherValue}}`

这有帮助吗? 添加评论 查看评论
 

问题 34. Give an example of custom pipe in Angular?

You can create custom reusable pipes for the transformation of existing value. For example, let us create a custom pipe for finding file size based on an extension,

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({name: 'customFileSizePipe'})

export class FileSizePipe implements PipeTransform {

  transform(size: number, extension: string = 'MB'): string {

  return (size / (1024 * 1024)).toFixed(2) + extension;

  }

}

Now you can use the above pipe in template expression as below,

template: `

  <h2>Find the size of a file</h2>

  <p>Size: {{288966 | customFileSizePipe: 'GB'}}</p>

  `

这有帮助吗? 添加评论 查看评论
 

问题 35. What is the difference between pure and impure pipe in Angular?

A pure pipe is only called when Angular detects a change in the value or the parameters passed to a pipe. For example, any changes to a primitive input value (String, Number, Boolean, Symbol) or a changed object reference (Date, Array, Function, Object). An impure pipe is called for every change detection cycle no matter whether the value or parameters changes. i.e, An impure pipe is called often, as often as every keystroke or mouse-move.

这有帮助吗? 添加评论 查看评论
 

用户评价最有帮助的内容:

版权所有 © 2026,WithoutBook。