Как сбросить модель в Angular2? - PullRequest
Новая
       35

Как сбросить модель в Angular2?

0 голосов
/ 17 мая 2018 
    <table class="table table-bordered" #tableEstimate style="padding-top:5%">
                  <thead>
                    <tr>
                      <th>Product Type</th>
                      <th>Product Name</th>
                      <th>Description</th>
                      <th style="width:15%">Quantity</th>
                      <th style="width:15%">Rate</th>
                      <th style="width:15%">Amount</th>
                      <th>Tax</th>
                    </tr>
                  </thead>
                  <tbody>
                    <tr *ngFor="let field of fieldArray; let i = index">
                      <td>
                        <select class="form-control" #type [id]="'product_name' + i" [name]="'product_name' + i" (change)="productype(type.value)" [(ngModel)]="fieldArray[i].pname">
                          <option>Select</option>
                          <option (click)="businesstype" *ngFor="let user of pro" [value]="user.type">{{user.type}}</option>
                        </select>
                      </td>
                      <td>
                        <select class="form-control" #name [id]="'product_type' + i" [name]="'product_type' + i" (change)="productname(name.value)" [(ngModel)]="fieldArray[i].ptype">
                          <option>Select</option>
                          <option (click)="businesstype" *ngFor="let user of all" [value]="user.id">{{user.name}}</option>
                        </select>
                      </td>

                      <td>
                        <input class="form-control" #des [id]="'product_description' + i" [(ngModel)]="descri"  [name]="'productdescription' + i" type="text" 
                          ngModel [(ngModel)]="fieldArray[i].descri">
                      </td>
                      <td>
                        <input class="form-control" #qua [id]="'quantity' + i" [(ngModel)]="quan" [name]="'quantity' + i" type="text" (input)="qutity(qua.value)"
                          ngModel [(ngModel)]="fieldArray[i].qty">
                      </td>
                      <td>
                        <input class="form-control" #Rate [id]="'rate' + i" [(ngModel)]="rate" [name]="'rate' + i" type="text" (change)="quanrate(Rate.value)" ngModel
                          [(ngModel)]="fieldArray[i].rate">
                      </td>
                      <td>
                        <input class="form-control" [id]="'amount' + i" [name]="'amount' + i" type="text" [(ngModel)]="amount" ngModel [(ngModel)]="fieldArray[i].amount">
                      </td>
                      <td>
                        <input type="checkbox" [checked]="false" (change)="updateAddrs($event)">
                      </td>
                    </tr>
                  </tbody>
                </table>


**component.ts**
//Add button function in table
 addFieldValue() {
    this.fieldArray.push(1);
    this.fieldArray[this.fieldArray.length - 1] = { "pname": "", "ptype": "", "descri": "", "qty": "", "rate": "", "amount": "" };
  }
productype(event)
  {
     this.category = []
    this.service.productname_desc().subscribe(response =>
      {
        this.all = response
        var json = JSON.stringify(this.all)
        for(let i=0;i<this.all.length;i++)
        {
          var json1 = this.all[i]
          if(event == json1['category'])
          {
            this.category.push(json1)
          }
        }
      },
      error => console.log(error));

  }
  productname(id)
  {
   for(let i=0;i<this.all.length;i++)
   {
     var json2 = this.all[i]
     if(id == json2['id'])
     {
       this.descri = json2['description']
       this.quan = json2['quantity']
       this.rate = json2['rate']
       this.amount = this.quan*this.rate
     }
   }
  }

У меня есть сомнения. Я использую ngmodel для автоматического заполнения значения в таблице строка за строкой. После запуска кода успешно получаем все данные в первой строке. Но во второй строке также заполняется значение. Затем, как выполнить ngmodelсбросить. Я добавляю component.ts также в методе цикла первой таблицы функций. Во втором методе получаем значения в БД и присваиваем в html с помощью ngmodel

...