如果字段在角度4中为空,则表单不会提交

时间:2018-02-13 07:04:55

标签: angular forms typescript firebase firebase-realtime-database

我正在开展角度4项目。我正在使用智能表格和表格。

<div class="row">
  <div class="col-lg-12">
    <nb-card>
      <nb-card-header>Default Inputs</nb-card-header>
      <nb-card-body >
        <form #f="ngForm" (ngSubmit) = "addNewStudent(f)" >
        <div class="row full-name-inputs">
          <div class="col-sm-6 input-group">
            <input type="text" placeholder="First Name" class="form-control" name="firstName" [(ngModel)]="data.firstName" />
          </div>
          <div class="col-sm-6 input-group">
            <input type="text" placeholder="Last Name" class="form-control" name="lastName" [(ngModel)]="data.lastName" [required]="false"/>
          </div >
            <div class="col-sm-6 input-group">
            <input type="text" placeholder="ID" class="form-control" name="id"[(ngModel)]="data.id" [required]=false />
          </div>
         <button type="submit" class="btn btn-primary">Submit</button>
        <button type="cancel" class="btn ">Cancel</button>

       </form>
      </nb-card-body>
    </nb-card>
      </div>
</div>

在表格的编辑按钮上打开表格并显示该表格中该行的全部数据,类似表格按钮将打开添加新数据,其中应添加数据但是如果我只输入一个数据并提交它不会添加它需要所有字段。

添加功能如下

addNewStudent(f: NgForm)
    {
    console.log(f.value);
    if(this.isAddPage)
       {
       this.service.addNewEnquiry(f.value);
       console.log("addenquiry");
       }
       else{
        this.service.editEnquiry(f.value);
       console.log("editenquiry");
       }
        this.router.navigate(['pages/dashboard1']);

    }

服务中的addNewEnquiry函数如下

 addNewEnquiry(data) 
{

    this.af.list('/enquirydata/').push(data);

}

当我输入所有字段时,它会将其添加到firebase中,但是当我没有填写所有字段时,它会显示错误。

任何帮助?

0 个答案:

没有答案