Question

添加方法工作正常，但是当我单击编辑方法时，相应的详细信息未按角度显示。在一页中编辑单击功能，在另一页中编辑表单。是否需要在编辑功能中传递ID以获得详细信息？

Detail.html：

 <ul class="result-list" *ngFor="let reg of regulation>
        <li>
          <div class="result-price" style="background:center #2d353c;color: #fff;">
            <h3 style="color: #fff">{{reg.UniqueCode}}</h3>
            <h4 style="color: #fff">{{reg.Force}}</h4>
            <p>
              <small>
                <b>{{reg.Remarks}}</b>
              </small>
            </p>
          </div>
          <div class="result-info">
            <h4 class="title">
              {{reg.Title}}
            </h4>
            <br>
            <p class="desc">
              <b>Summary:</b>  {{reg.Details}}
            </p>
            <div class="btn-row" id="ignore7">
              <a routerLink="/regulationform" data-toggle="tooltip" data-container="body">
                <label class="col-form-label"></label>
                <i class="fa fa-edit" (click)="onEdit(reg)"> Edit</i>
              </a>
            </div>
          </div>   
        </li>
        <br>
      </ul>

detail.ts：

  async onEdit(regulation:Regulation) {
    this.explorerService.selectedRegulation = Object.assign({}, regulation)
  }

detail.service.ts：

async UpdateRegulation(regulation: Regulation) {
    const response = await this.httpClient.put('url', regulation,
        { observe: 'response', withCredentials: true }).toPromise();
    return response;
}

form.html：

<div class="row m-b-15">
        <label class="col-form-label col-md-3">Regulation Details</label>
        <div class="col-md-9">
          <textarea class="form-control" rows="3"  [(ngModel)]="regulation.Details" name="Details" #RegulationDetails="ngModel"></textarea>
        </div>
          </div>

form.ts

 onAddRegulation() {
    if(this.regulations.RegulationID==null)
    {
    this.explorerService.addRegulation(this.regulations)
      .then((response) => {
        console.log(response);
      })
      .catch((error) => console.log(error));
      alert("Your Regulation added Successfully");
    }
      else {
        this.explorerService.UpdateRegulation(this.regulations)
      .then((response) => {
        console.log(response);
      })
      .catch((error) => console.log(error));
      }


  }

如何实现？

Answer 1

您在同一上下文中拥有routerLink和click

<a routerLink="/regulationform" data-toggle="tooltip" data-container="body">
      <label class="col-form-label"></label>
      <i class="fa fa-edit" (click)="onEdit(reg)"> Edit</i>
 </a>

从此处删除routerLink

<a data-toggle="tooltip" data-container="body">
      <label class="col-form-label"></label>
      <i class="fa fa-edit" (click)="onEdit(reg)"> Edit</i>
 </a>

在您的onEdit()函数中使用此路由

import { Component } from '@angular/core';
import { Router } from '@angular/router';

@Component({
  // ...
})
export class YourComponent {

  constructor(private router: Router) {}

  // ...

   async onEdit(regulation:Regulation) {
    this.explorerService.selectedRegulation = Object.assign({}, regulation);
    this.router.navigate(['/products']);
  } 
}

编辑功能不会以角度6显示对应的值

1 个答案: