javascript - 如何在单击按钮时验证输入不保存 0 或小于 0?

标签 javascript html angular typescript angular6

我想通过 Angular 6 中的输入类型编号保存长度。但长度不应为 0 或小于 0 。当有人输入 0 或小于输入值时,它应该在按钮单击时显示错误。我尝试添加 min="1"但它不起作用

<mat-form-field class="example-full-width">
                <input matInput type="number" [(ngModel)]="ItemModel.Length" placeholder="Length"  min="1"

                id="Length" name="Length" required>
              </mat-form-field>

最佳答案

您可以将最小值设置为 0.1 并为红色边框添加 ngclass

    <mat-form-field class="example-full-width">
          <input matInput [(ngModel)]="ItemModel.Length" type="number" name="Length"
            placeholder="Length" [ngClass]="{ 'red': ItemModel.Length <= 0 && 
            greaterthenzero  }" min="0.1" required>
    </mat-form-field>

在提交按钮上,您可以检查您的模型值并添加一个 bool 属性,如果值小于 0 则设置为 true

    submit() {
         this.greaterthenzero = false;
         if (this.ItemModel.Length <= 0) {
             this.greaterthenzero = true;
         }
    }

关于javascript - 如何在单击按钮时验证输入不保存 0 或小于 0?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58235309/

相关文章:

angular - 是否可以将响应式(Reactive)数组控件绑定(bind)到 ngx-datatable?

javascript - 如何避免多次发送表单

javascript - 如何从 Highstock 图表中获取导航器选择?

html - Django 模板上的 URL 编码

javascript - 无法让我的 bootstrap carousel 工作 - jQuery 行禁用其余代码

php - 使用 jQuery 通过单击按钮隐藏 "li"标记

javascript - 如何以 Angular 2在 Canvas 上显示图像?

javascript - 从URL获取json并显示特定数据

javascript - Elastislide - 如何使其适用于不同的图像宽度

javascript - 使用 HighCharts 在不同的边显示部分字幕