这周,我遇到了NG0901错误(是的,没有消息比这个错误),我不知道为什么,因为看上去是由于RouterLink没有正确地工作。
总而言之,它是面包店的订单经理。剩下的就是修改、添加或删除客户端、仓库等的参数页面。
因此,我创建了第一个页面,即调用params,这个页面有带有routerLink元素的按钮到其他4个页面。
下面是我的params页面的html代码:
<ion-header>
<ion-toolbar>
<ion-title>P.I.C 2.0 - Paramétre</ion-title>
<ion-back-button slot="start" color="primary" defaultHref="home"></ion-back-button>
</ion-toolbar>
</ion-header>
<ion-content [fullscreen]="true">
<table>
<tr>
<td><ion-button> <a routerLink="params-client">Client</a></ion-button></td>
<td><ion-button routerLink="./params_depot">Depot</ion-button></td>
<!--<td><ion-button routerLink="../depot">Feuille depot</ion-button></td>-->
</tr>
<tr>
<td><ion-button routerLink="params-boul">Produit Boulangerie</ion-button></td>
<td><ion-button routerLink="params_pat">Produit Patisserie</ion-button></td>
<!--<td><ion-button routerLink="../params">Paramètre</ion-button></td>-->
</tr>
</table>
</ion-content>
对于这个链接来说,离子按钮和routerLink的行为是不寻常的。
这也是我的ng版本
下面也是StackTrace:
ERROR Error: Uncaught (in promise): Error: NG0901
Error: NG0901
at e.find (main.js:1:604380)
at C.ngDoCheck (main.js:1:468239)
at Xa (main.js:1:501521)
at cs (main.js:1:501322)
at xi (main.js:1:501042)
at $i (main.js:1:524323)
at sy (main.js:1:531388)
at Vv (main.js:1:525062)
at $i (main.js:1:525073)
at Hv (main.js:1:525433)
at fe (polyfills.js:1:137971)
at fe (polyfills.js:1:137482)
at polyfills.js:1:138833
at S.invokeTask (polyfills.js:1:128604)
at Object.onInvokeTask (main.js:1:583005)
at S.invokeTask (polyfills.js:1:128525)
at S.runTask (polyfills.js:1:123644)
at P (polyfills.js:1:130949)
at S.invokeTask [as invoke] (polyfills.js:1:129774)
at x (polyfills.js:1:142703)
zm @ main.js:1
我还添加了类型记录和html页面,其中routerLink指向:
import { Component, OnInit } from '@angular/core';
import {HttpRequestService} from "../../http-request.service";
@Component({
selector: 'app-params-client',
templateUrl: './params-client.page.html',
styleUrls: ['./params-client.page.scss'],
})
export class ParamsClientPage implements OnInit {
public client:any = {}
constructor(private http: HttpRequestService) {
this.http.get_client_all((data) => {
this.client = data;
});
}
ngOnInit() {
}
}
<ion-header>
<ion-toolbar>
<ion-title>P.I.C 2.0 - Parémetre Client </ion-title>
<ion-back-button slot="start" color="primary" defaultHref="params" ></ion-back-button>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-grid>
<ion-row>
<ion-col>Id</ion-col>
<ion-col>Nom</ion-col>
<ion-col>Lieu</ion-col>
<ion-col>Téléphone</ion-col>
<ion-col>Modifier</ion-col>
<ion-col>Supprimer</ion-col>
</ion-row>
<ion-row *ngFor="let c of client">
<ion-col>{{c.id_client}}</ion-col>
<ion-col>{{c.name}}</ion-col>
<ion-col>{{c.lieu}}</ion-col>
<ion-col>{{c.tel}}</ion-col>
<ion-col>
<ion-button>Modifier</ion-button>
</ion-col>
<ion-col>
<ion-button>Supprimer</ion-button>
</ion-col>
</ion-row>
</ion-grid>
</ion-content>
发布于 2022-02-08 12:50:48
问题似乎是由于下面的属性初始化代码:
public client:any = {}
client
被定义为一个对象,而不是一个数组,因此您将在*ngFor="let c of client"
期间得到一个错误。
NgFor只支持绑定到诸如数组之类的Iterable。如果您期望从HTTP调用接收到的data
是一个数组,那么您应该使用而不是来用空对象{}
初始化client
。要么可以分配[]
,要么根本没有赋值。
如果client
确实是一个对象,那么您应该使用KeyValuePipe对一个对象进行迭代。
将对象或Map转换为键值对数组。
https://stackoverflow.com/questions/71008196
复制相似问题