2017-07-17 67 views
1

md-error在我的輸入中未觸發最小值/最大值。儘管如此,它正在爲「必需」工作。md-error沒有以數字輸入的最大值/最小值觸發

我在app.module.ts的NgModule中導入了MaterialModule。

HTML:

<div class="form-group"> 
       <md-input-container> 
       <input mdInput id="useramount" 
         name="useramount" 
         type="number" 
         class="form-control " 
         [(ngModel)]="amount" 
         #useramount="ngModel" 
         placeholder="amount" 
         min="{{40 | number}}" 
         max="{{300 | number}}" 
         required/> 
       <md-error *ngIf="amountFormControl.hasError('required')"> 
        <span>{{'NOT_VALID_FIELD'| translate}} </span> 
       </md-error> 
       <md-error *ngIf="amountFormControl.hasError('min')" 
        > 
        <span>{{'FIELD_MIN_VAL'| translate}}</span> 
       </md-error> 
       <md-error *ngIf="amountFormControl.hasError('max')" 
          > 
        <span>{{'FIELD_MAX_VAL'| translate}}</span> 
       </md-error> 
       </md-input-container> 
      </div> 

TS文件:

public amountFormControl = new FormControl('', [Validators.min(40), Validators.required, Validators.max(300)]); 
+0

不確定您使用的是哪個版本的材料,但MaterialModule 已在beta 3中棄用。您需要導入單個模塊。在你的情況下,你需要導入MdInputModule。您可以創建自己的模塊,用於導入和導出要在應用中使用的所有材質模塊,並將該模塊導入到您的應用模塊中。 – Rama

+0

@Rama使用beta.8!它是爲我工作的需要,但我從驗證器對象的智能感知中獲得最小和最大值!找不到任何關於他們的文檔!有沒有其他選項可以對輸入類型編號進行驗證? – Hazu

回答

0

嘗試使用minlengthmaxlength代替minmax

這就是它的文件Angular docs

角度形式包括一些內置的驗證器功能,這些功能可以幫助您檢查表單中的常見用戶輸入。除了minlengthmaxlengthrequired涵蓋的內置驗證器之外,還有其他諸如emailpattern的Reactive Forms。

相關問題