angular - 如何存储和使用 Angular 管道结果在 html 文件中添加 ngClass

Question

我在做什么:

html文件

 <div *ngFor='let result of results'>
    <div [ngClass]='{"myclass": someArray | inArray:result.id}'>
    </div>
    </div>

ts 文件:

someArray = [1, 2, 3]

results = [
{id:1, name:'abc'},
{id:2, name:'xyz'},
{id:4, name:'pqr'}]

结果:我从来没有被分配到类(class)。

如何使用“as”将管道结果存储在 html 文件中以在 ngClass 中使用它？

inArray (pipe):管道根据值是否存在于数组中返回 true 或 false。

引用Angular 2 add style based on pipe result :

更新 1:

inArray (pipe):管道返回 -1 或索引值，如果值存在于数组中。

更新 2: stackblitz

Answer 1

如果我没记错的话，这就是您要找的!

对不起，我有点事，现在才回来..

检查 StackBlitz

仅在值存在时才应用该类。

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

@Pipe({ name: 'inArray' })
export class inArrayPipe implements PipeTransform {

  transform(value: any, exponent: any): boolean {
    let result = value.indexOf(exponent);
    return result > -1;
  }
}

剩下的就是你的代码.. 但在上面的 Stackblitz 示例中它们都是一起工作的。