Question

我知道您可以在此类组件中使用自定义管道。

// ...
import { CoolPipe } from './cool.pipe';

// ...
export class AppComponent {

  constructor(private _coolPipe: CoolPipe) {}

  pipe(value) {
    return this._coolPipe.transform(value);
  }
}

但是如何链接管道？

在有角的html组件中，您可以执行以下操作

<div *ngFor="let item of items | filter: filters | order: order">
</div>

在角度组件中是否可以使用等效项？

我知道我可以在html组件中执行此操作，但我想在component.ts文件中执行此操作

我唯一想到的方法就是

pipe(value) {
   let newValue;
   newValue = this._filterPipe.transform(value);
   newValue = this._orderPipe.transform(value)
   return newValue;
}

这样的事情会发生吗，这是最好的方法吗？

我的用例如下

我已经创建了3个管道filter，search，order

现在在我的 component.html 中，我遇到以下情况

<div *ngIf="(items | filter: filter | order: order | search: searchTerm).length === 0 && value && !otherValue"></div>

现在这会使我的html组件混乱，因此我想将此逻辑移到 component.ts 文件中，并返回一个返回true或false

这可能吗...

Answer 1

只需创建一个util（礼貌：Andy Van Slaars），就像这样：

from django.db.models import F
class PostListView(LoginRequiredMixin, ListView):
    context_object_name = 'posts'

    def get_queryset(self):
        queryset = Post.objects.select_related('created_by').annotate(username=F('created_by__username')).order_by('-id')
        return queryset

然后，像这样在您的TS中使用它：

const _pipe = (f, g) => (...args) => g(f(...args))
export const pipe = (...fns) => fns.reduce(_pipe);

在Angular Component中

1 个答案: