Question

我如何从表格外面调用表单，我有一个有角度的表单，我正在使用bootstrap 这是一个片段，一个带有ngubmit的表单，为了保存设计，我试着从外面打电话，请问我该怎么做呢

   <ul class="navbar-nav">
          <li class="nav-item">
            <a class="btn btn-light"
               type="submit"
               title="Save department"
               data-toggle="tooltip"
               data-placement="bottom">
              <i class="fa fa-save"></i>
              <span class="d-none d-sm-inline" *** this is where i tried to call the form**** onclick="processForm()">Save</span></a></li>
        </ul>
      </nav>

    </header>
    <section id="department">
      <div class="container-fluid">
        <div class="row">
          <div class="col">
            <div class="card">
              <div class="card-body">
    ****this is the begining of the form 
                <form  (ngSubmit)="processForm()"    id="editFormTruck" >

                  <div class="form-group">
                    <label class="form-control-label"
                           ngFor="truckCode">Truck code</label>
                    <input type="text" name="truckCode"  class="form-control" [(ngModel)]="truck.truckCode">
                  </div>

                  <div class="form-group">
                    <label class="form-control-label"
                          ngFor="purchasedDate">purchased Date</label>
                    <input type="date" name="purchaseDate" class="form-control" [(ngModel)]="truck.purchasedDate" useValueAsDate>
                  </div>

                  <div class="form-group">
                    <label class="form-control-label"
                           ngFor="truck.description">Description</label>
                    <input type="text" name="description" class="form-control" [(ngModel)]="truck.description">
                  </div>
                </form>
              </div>
            </div>
          </div>
        </div>
      </div>

Answer 1

如果您想手动提交表单，可以获取表单的引用并手动触发ngSubmit上的发出。我把simple Plunker放在一起做了。

<span class="d-none d-sm-inline" (click)="form.ngSubmit.emit()">Save</span>

...

<form #form (ngSubmit)="processForm()" ...>...</form>

未定义未捕获的ReferenceError和processForm

1 个答案: