我有一份带有表格的有Angular 的申请书.在本例中,我有一个输入来输入百分比.因此,我希望挡路输入的值在0到min="0"之间. 我试图将min="0"max="100"相加,但我仍然可以输入大于min="0"或小于0的数字.

template

<md-input-container>
  <input type="number" 
    maxlength="3" 
    min="0" 
    max="100" 
    required 
    mdInput 
    placeholder="Charge" 
    [(ngModel)]="rateInput" 
    name="rateInput">
  <md-error>Required field</md-error>
</md-input-container>

你知道我怎么做吗?

推荐答案

我成功地使用了表单控件.

<md-input-container>
    <input type="number" min="0" max="100" required mdInput placeholder="Charge" [(ngModel)]="rateInput" name="rateInput" [formControl]="rateControl">
    <md-error>Please enter a value between 0 and 100</md-error>
</md-input-container>

在我的打字脚本代码中,我有:

this.rateControl = new FormControl("", [Validators.max(100), Validators.min(0)])

因此,如果我们输入一个大于100或小于0的值,则material 设计输入将变为红色,并且该字段不会被验证.所以之后,如果值不好,当我点击save按钮时,我不会保存.

Angular相关问答推荐

Angular独立组件(使用LoadComponents)-懒惰加载服务不工作

以Angular 表示显示特殊字符

如何在构造函数中测试MatDialog.Open

Angular 16+使用ngTemplateOutlet有条件地呈现几个模板中的一个

重新打开模态时 ng-select 中的重复值 - Angular

如何更改 Angular material 按钮中的内部 RippleColor 和 UnboundedRipple 效果?

将 injectiontoken 用于 Angular 中的模块特定设置

可观察的等待直到另一个可观察的值

如何以Angular 显示动态视图模型

绑定 Angular material Select 列表

Angular2 Material Dialog css,对话框大小

如何在Angular2中基于特定的构建环境注入不同的服务?

无法绑定到matDatepicker,因为它不是 input的已知属性

导航到同一条route路由不刷新组件?

Angular 2 - 组件内的 formControlName

Angular - 工作区中未设置配置

Angular2延迟加载模块错误'找不到模块'

测试一个包含 setTimeout() 的函数

NPM 脚本 start退出,但未指示 Angular CLI 正在侦听请求

Hot and Cold observables:有 hot和 cold运算符吗?