实例:

管道实现内容超出显示省略号

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

@Pipe({
  name: 'dataBind',
})
export class DataBindPipe implements PipeTransform {

  transform(value?:string, length?: string):any{
    if(value&&value.length>length){
      return value.substring(0, length) + "...";
    }else if(value){
      return value
    }else{
      return ''
    }
  }
}

在模板中使用

<span>{{ '123456789' | dataBind: 6 }}</span>

最终显示: 123456…

在ts中使用

@Component({})
export class Test {
	constructor(protected dataBind: DataBindPipe) {}

	fun() {
		// 最终返回 1234567...
		return this.dataBind.transform('123456789', 7)
	}
}