小编ash*_*rki的帖子

我的正常形式如下所示（您可以忽略内部字段，因为它们都是输入字段）：

<div class="col-md-12" style="float: none;">
   <div class="form-group row">
      <div class="col-md-6" style="border: 2px solid #efefef;">
         <div class="card-body">
            <div class="col-md-12">
               <h4>Type</h4>
            </div>
         </div>
      </div>
      <div class="col-md-6" style="border: 2px solid #efefef;">
         <div class="card-body">
            <div class="form-group row ">
               <div class="col-md-4">
                  <label>Appeal Reason</label>
               </div>
               <div class="col-md-3">
                  <label>Appeal Amount</label>
               </div>
               <div class="col-md-3">Penalty</div>
               <div class="col-md-2"></div>
               <div class="col-md-4">
                  <input type="text"
                     class="form-control"
                     id="applReason" 
                     name="applReason" required> <span
                     id="fromDateError" style="color: red; font-weight: bold"></span>
               </div>
               <div class="col-md-3">
                  <input type="number"
                     class="form-control"
                     id="applAmount" name="applAmount"
                     required>
                  <span id="toDateError" style="color: red; font-weight: bold"></span>
               </div>
               <div class="col-md-3"> …

我的数据表如下所示：

这里它在单个页面中显示默认的 10 个数据。我需要显示 58 个条目中的 1 到 5 个，所以我尝试放置max:5但它不起作用。我只需要显示 5 个数据，用户可以使用分页其他数据访问。

我的数据表代码是：

var table = $('#firstTable').DataTable({
        "processing" : true,
        "scrollY": 410,
        "scrollX": true,
        order: [ 0, 'asc' ],
        max :5,
        "ajax" : {
            "url" : A_PAGE_CONTEXT_PATH + "/form/api/getAllSelection/all",
            dataSrc : ''
        },
        "columns" : [ {
            "data" : "selectionId"
        }, {
            "data" : "selectionDate"
        }, {
            "data" : "selectedBy"
        }, {
            "data" : "eximPanNo"
        }, {
            "data" : "eximPanName"
        }, {
            "data" : "eximPanAddr"
        }, …

实际上我有两种类型的输入类型：一种是普通文本，另一种是单选类型。我想在输入提交按钮之前验证这两个字段。

对于这个普通的输入字段，我进行了验证，但我不知道如何为单选按钮做。我想验证用户是否没有选择任何单选按钮。

<form  name="form" #f="ngForm" (ngSubmit)="f.form.valid && onSubmit()" novalidate class="feedback-form">
         <div class="col-md-12">

            <div class="form-group col-md-4">
               <label for="selectionDate">Selection Date</label>
               <input type="text" 
               id="selectionDate"
               class="form-control"
                name="selectionDate"
                placeholder="Please enter the date" 
               [(ngModel)]="selection.selectionDate"
                #selectionDate="ngModel"
                [ngClass]="{ 'is-invalid': f.submitted && selectionDate.invalid }"
                 required
                  />

             <div *ngIf="f.submitted && selectionDate.invalid" class="invalid-input">
            <!-- individual validation errors -->
            <div *ngIf="selectionDate.errors?.required">DateField is required</div>
          </div>

            </div>
            <div class="form-group col-md-4">
               <label for="selectedBy">Selected By</label>
               <br>
               <label class="radio-inline">
               <input type="radio" name="selectedBy" 
               [(ngModel)]="selection.selectedBy" value="Department">Department
               </label>
               <label class="radio-inline">
               <input type="radio" name="selectedBy"  
               [(ngModel)]="selection.selectedBy" value="Office">Office
               </label>
            </div>
         </div>
</form>

我有一个页面运行在“ http://localhost:4200/assignmentForAudit ”，用户界面看起来像

当我单击删除按钮时，数据将被删除，但页面不会刷新。我试着把 this.router.navigate(['/assignmentForAudit']);在删除操作后放置，但它没有刷新页面。我怎样才能实现这种刷新方法以便删除数据？

在component.ts中删除的方法

onDelete(nas:any){
   this.assignmentAudit.id=nas.assignmentAudit[0].id;
   console.log(this.assignmentAudit.id);
  if(window.confirm('Are sure you want to delete this item ?')){
     this.assignmentAuditService.deleteGroupFromSelection(this.assignmentAudit.id)
      .subscribe(
        data => {
          console.log(data);
        },
        error => console.log(error));
   }
    this.router.navigate(['/assignmentForAudit']);

}

assignment-audit.service.ts类方法调用api操作

deleteGroupFromSelection(id: number): Observable<any> {
    return this.http.delete(`${this.baseUrl}/${id}`, { responseType: 'text' });
  }

删除操作工作正常，但问题是页面不刷新。