Question

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

我正在使用上面的语法来连接两个字符串以映射一个数组。效果很好，但是当我尝试使用如下所示的split函数时，出现模板解析错误。

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

当我在上述ngIf内部使用split函数时，应用程序引发错误：模板解析错误。我很难找出如何转义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

在Angular的ngIf条件中使用split函数

1 个答案: