Question

我是角度2的新手，我曾经使用像这样的过滤器获取angularjs中文本的摘录：

app.filters.js：

app.filter('excerpt', function () {
    return function (text, length) {
        if (text.length > length) {
            return text.substr(0, length) + '...';
        }
        return text;
    }
});

html文件中的

：

{{blog.content | excerpt:90}}

角度2中的等价物是什么？

Answer 1

这应该是这样做的：

首先创建过滤器import { Pipe, PipeTransform } from '@angular/core'; @Pipe({ name: 'excerpt', pure: false }) export class ExcerptFilter implements PipeTransform { transform(text: String, length:any ): any { if (!text || !length) { return text; } if (text.length > length) { return text.substr(0, length) + '...'; } return text; } }文件：

<强> excerpt.filter.ts

<div class="description">{{blog.content | excerpt:90}} </div>

然后您可以像以下一样使用它：

<强> template.component.html

app.module.ts

确保您在import {ExcerptFilter} from './filters/excerpt.filter';文件中导入过滤器：

.add_cascade()

有关创建管道的更多信息，请参阅the Docs

Answer 2

@Pipe({
  name: 'excerpt'
})
export class ExcerptPipe implements PipeTransform {
  transform(text: string, length: number): string {
    if (text.length > length) {
      return text.substr(0, length) + '...';
    }
    return text;
  }
}

{{ textToTransform | excerpt: 90 }}

请记住在模块中添加管道。

如何在角度2中制作摘录滤镜？

2 个答案: