相关疑难解决方法(0)

根据thinkgram.io,目前支持的验证器是:

• 需要
• 使用MINLENGTH
• 最长长度
• 图案

所以,考虑下面的代码(这里是plunkr):

@Component({
  selector: 'my-app',
  template: `

  <form #formRef="ngForm">
    <input type="number" [(ngModel)]="firstValue" name="firstValue" min="0" required/>
    <input type="text" [(ngModel)]="secondValue" maxlength="5" name="secondValue" required/>
    <button type="submit"> Submit </button> 
  </form>

  FORM: {{formRef.form | json }}
`
})
export class AppComponent { 
  firstValue = -22;
  secondValue = "eyy macarena!"; 
}

虽然minlength支持,但min="0"角度验证会忽略它:

因此,要在firstValue ngModel <0时使表单导致错误,我是否需要构建自定义验证器？

I want to disable writing into a field of type number, for avoiding strings data, and write just numbers, so how to enable scroll bars only ?

<form>
 <input type="number"  path="note" min="1" max="20"/>
</form>

我有一个输入，类型是数字。我要设置最小值和最大值，如果输入超出此范围（<最小值或>最大值），将显示错误。

我的问题是，如果输入不是空但无效，则错误消失（例如：min = 10，max = 20，input = 2000，仍然没有错误显示）。

我在此站点上搜索，并且有关于验证的帖子，但是解决方案是使用<md-input-container>和<md-error>。我不想使用<md-input-container>和<md-error>。

参考：这里

反正有解决我的问题的方法吗？

我的add-hero.component.html：

<div class="publishedYear">
<label>Publish Year: </label>
<input type="number" id="PublishedYear" name="PublishedYear" required min="10" max="20" 
[(ngModel)]="hero.PublishedYear" #publishedYear="ngModel">
<p class="alert alert-danger invalid" *ngIf="publishedYear.errors">Invalid Published Year</p>
</div>

我的英雄

export class Hero {
Id: number;
Name: string;
PublishedYear: number;
Complete?: boolean;
}