Question

我有这项服务，用于从休息点获取对象列表：

getPayload

对象：

@Injectable({
  providedIn: 'root'
})
export class MerchantService {

  constructor(private http: HttpClient) {
  }    

  getMerchantsList(): Observable<Array<MerchantList>> {
    return this.http.get<Array<MerchantList>>(environment.api.urls.merchants.getMerchants);
  }
}

组件：

export class Merchant {
  constructor(
    public id: string,
    public name: string,
    public state_raw: string,
    public users: string,
  ) {}
}

如何将@Component({ selector: 'app-contract', templateUrl: './contract.component.html', styleUrls: ['./contract.component.scss'] }) export class ContractComponent implements OnInit { merchants: MerchantList[]; constructor(private merchantService: MerchantService, private route: ActivatedRoute) { } ngOnInit() { this.merchantService.getMerchantsList() .subscribe(value => { if (value != null) { this.merchants = value; } }); }的内容打印到表格中？

我想将Array内容打印到每个表行中。

Answer 1

您正在寻找*ngFor结构指令

   <table>
    <tr>
      th>Id</th>
      <th>Name</th>
    </tr>
    <tr *ngFor="let row of merchants">
      <td>{{row.id}}</td>
      <td>{{row.name}}</td>
    </tr>
   </table>

在表中打印阵列

1 个答案: