javascript - 在 Angular 的 ngIf 条件中使用拆分函数

Question

<div *ngIf="store[obj?.FundCode + obj?.PayWith].status == 'fail'">test</div>

我正在使用上述语法连接两个字符串以映射一个数组。它工作正常，但是当我尝试使用如下所示的拆分函数时，出现模板解析错误。

<div *ngIf="store[obj?.FundCode + obj?.PayWith.split(/[ ,]+/).join('-')].status == 'fail'">test</div>

当我像上面那样在 ngIf 中使用 split 函数时，应用程序抛出错误:模板解析错误。我无法找出如何转义拆分函数并正确执行它。

Answer 1

我不喜欢在 HTML 中使用复杂的语法，即使它是真正的语法；它会感到困惑。

您可以使用getter函数作为变量；就像这样:

get isFailed() : boolean {
    // Check if obj is defined to avoid errors.
    if(! this.obj) return false;

    let key = this.obj.FundCode + obj?.PayWith.split(/[ ,]+/).join('-');
    return this.store[key].status == 'fail';
}

然后在 HTML 中使用这个变量:

<div *ngIf="isFailed"> test </div>

这样会更清楚，应该可以解决您的问题。

阅读更多关于 get 的信息