title: How to add Min/Max input restriction for user input?
body: <p>In my angular application, I have an input field where I want the user to enter an input value between 0-100. I used min/max attribute, but it's not working. How can I restrict users from entering input value less than 0 and more than 100?</p>
  
  <p><strong>component.html</strong></p>
  
  <pre><code>&lt;mat-form-field&gt;
     &lt;input type="hidden" [(ngModel)]="row.id" [ngModelOptions]="{standalone: true}" id="id" name="Id"&gt;
      &lt;input  type="number"[(ngModel)]="row.percent_complete" min="0" max= "100"&gt; 
  &lt;/mat-form-field&gt;
  
  
  
   &lt;div class="submit-button"&gt;
      &lt;ion-button color="primary" expand="block" fill="outline" (click)="onSubmit()"&gt;Submit Changes&lt;/ion-button&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p><strong>component.ts</strong></p>
  
  <pre><code> onSubmit() {
  
        let postData = [];
  
        this.deltasByGroupId[this.selectedGroupId] = this.measures;
  
        for (var groupId in this.deltasByGroupId) {
          if (!this.deltasByGroupId.hasOwnProperty(groupId)) { continue }
  
          for (var k in this.deltasByGroupId[groupId]) {
            if (!this.deltasByGroupId[groupId].hasOwnProperty(k)) { continue }
  
            let secs = this.deltasByGroupId[groupId][k];
  
            var item1 = secs["items"]
            for (var j in item1) {
  
              var item2 = item1[j]
              for (var l in item2) {
  
                var listItem = item2["items"]
                for (var li in listItem) {
                  this.model = new MeasurementChange(listItem[li].id, listItem[li].percent_complete);
                  postData.push(this.model);
                }
              }
            }
          }
        }
  
        this.pEntryService.postEntries(postData).subscribe(res =&gt; {
          this.localDialogRef.close();
  
          Swal(
            'Success!',
            'Form Submitted Sucessfully!',
            'success',
          )
        })
  
      }
    });
  }
  </code></pre>