Question

我创建了一个Custom Validator方法，用于检查在数组中是否存在输入mat-autocomplete的值。

此方法返回{isExchange：true}。我在另一个返回错误消息的方法中使用this.tradeForm.get（＆＃39; exchange＆＃39;）。hasError（＆＃39; isExchange＆＃39;）。一切正常。

mat-autocomplete的一部分，在mat-form-field标签内，我添加了以下代码：

<mat-error *ngIf="tradeForm.get( 'exchange' ).invalid">{{getFormErrorMessage( 'exchange' )}}</mat-error>

当出现错误时，这不会显示，但是，当我将 mat-error 标记更改为小标记时，它会起作用。< / p>

我已经读过，当FormControl无效时，只会出现mat-error，但我无法找出我的原因。

有没有人知道我错过了什么？

我可能需要在控件中更改某些值才能显示mat-error标记？

这里是验证器功能的样子：

isExchange( control: FormControl ) {
    let exchanges = [{ID: 1, Title: 'BitTrex'}, {ID: 2, Title: 'Bitfinex'}, {ID: 3, Title: 'Binance'}, {ID: 4, Title: 'Kraken'}, {ID: 5, Title: 'Coinmarketcap'}];

    if( exchanges.find( exchange => exchange.Title === control.value ) === undefined ) {
        control.markAsTouched(); // This makes it work, not sure why
        return { isExchange: true };
    } else {
        return null;
    }
}

这就是它的用法：

    this.tradeForm = new FormGroup({
        exchange: new FormControl( this.newTrade.Exchange.Title, [this.isExchange] );
    });

Answer 1

我通过在验证器函数中添加control.markAsTouched（）找到了一个有效的解决方案。

mat-error没有显示错误

1 个答案: