Question

如何限制用户输入大于order.leftToFulfill的值？

  <input  class="table-input" type="number" name="check"  [(ngModel)]="tempFulfill" matInput min="1" max="{{order.leftToFulfill}}" oninput="this.value = Math.abs(this.value)">

我要做的是：例如如果order.leftToFulfill = 50 而不是我必须限制用户输入的值大于50。

Answer 1

检查以下Stackblitz Demo

HTML：

var array1 = ['a'];
var array2 = ['d', 'e', 'f'];

array1.forEach(function(element1) {
  array2.forEach(function(element2) {
        setTimeout(function(){
            console.log(element2);
        }, 1000)
  });
});
console.log("Hello");

app.component.ts：

<input type="text" [maxLength]="maxLength" [ngModel]="value" (ngModelChange)='up($event)'/>

说明：

import { Component, Injectable } from '@angular/core';

@Injectable()
export class MyService {

  MAXLENGTH = 2;

  getMaxLength() {
    return this.MAXLENGTH;
  }

}


@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  name = 'Angular 4';
  maxLength: number;
  value = 0;
  constructor(private myService: MyService) {
    this.maxLength = myService.getMaxLength();
  }
  up(newValue) {
    console.log(newValue);
    if (newValue < 0) {
      this.value = 0;
    } else if (newValue > 50) {
      this.value = 50;
    } else {
      this.value = newValue;
    }
  }
}

用于将输入长度限制为MAXLENGTH = 2; getMaxLength() { return this.MAXLENGTH; }，例如x = 2。

极限值的核心：

检查值是小于0还是大于50，如果未将其设置为最小值/最大值。

限制HTML中输入字段的最大值

1 个答案: