表中的复选框以选择Angular中的表行

时间:2019-03-14 10:07:56

标签: html angular

我在Angular 6中有一个表,那里有一个复选框?我想做的是选择表格行,即复选框,然后点击选择按钮,然后提交。我想知道表是否必须包装在<form>中。到目前为止,我的HTML的结构是有效的,但它不起作用:

 <form [formGroup]="assetForm" (ngSubmit)="onSubmit()">
     <table class="table table-striped table-hover mb-10">
         <thead>
            <tr>
              <th>Number</th>
              <th>Sev</th>
              <th>Phone</th>
            </tr>
          </thead>
          <tbody>
             <tr *ngFor="let incident of data">
               <td>
                  <label class="form-radio">
                    <input type="radio" name="id_number" value="id_number">
                    <i class="form-icon"></i>{{incident.number}}
                  </label></td>
                <td>{{incident.sev}}</td>
                <td>{{incident.phone}}</td>
              </tr>
            </tbody>
       </table>
       <button class="btn btn-primary" [disabled]="!Form.valid" type="submit">Select</button>
  </form>

Ts.file

onSubmit() {
    if (this.assetForm.invalid) {
      this.assetForm.setErrors({ ...this.assetForm.errors, 'required': true });
      return;
    }
    this.uploading = true;
    this.service.post(this.assetForm.value).subscribe((response: any) => {
      console.log(response);//On success response

    }, (errorResponse: any) => {
      console.log(errorResponse); //On unsuccessful response
      this.error = true;
      this.uploading = false;
    });
  }

1 个答案:

答案 0 :(得分:0)

public struct Range<T> where T : IComparable<T>
{
    public Range(T start, T end)
    {
        Start = start;
        End = end;
    }

    public T Start { get; }

    public T End { get; }

    public bool Includes(T value) => Start.CompareTo(value) <= 0 && End.CompareTo(value) >= 0;

    public bool Includes(Range<T> range) => Start.CompareTo(range.Start) <= 0 && End.CompareTo(range.End) >= 0;
}

尝试一下,希望它能工作。