Ionic 6从本地存储迭代



大家好,我从我的Laravel后端获取了一个对象,其中包含一些与登录用户相关的设备。我以这种方式将数据存储到我的Ionic本地存储中:

login(user: User): Observable<AuthResponse> {
return this.http.post(`${this.apiURL}/login`, user).pipe(
tap(async (res: AuthResponse) => {
console.log('res', res);
await this.storage.set("ACCESS_TOKEN", res['data']['token']);
await this.storage.set("id", res['data']['id']);
await this.storage.set("devices", res['data']['devices']);
console.log(this.authSubject);
this.authSubject.next(true);
})
);

}

所以现在我需要为登录后获取的每个设备创建一个离子幻灯片。我尝试了我的NgInit:

ngOnInit() {
this.storage.get("devices").then((value) => 
{
console.log('devices', value);
let devices = value;
});

}

但没有起作用。我需要在我的视图中以幻灯片形式显示设备:

<ion-slides >
<ion-slide *ngFor="let device of this.devices">
<ion-row>
<h1>{{ device.name }}</h1>
</ion-row>
<ion-row>
<img src="{{ device.image }}" >
</ion-row>
</ion-slide>

应该将devices绑定到组件类的this上下文,而不是在let变量中

let devices = value

this.storage.get("devices").then((value) => {
console.log('devices', value);
this.devices = value
});

在HTML上只使用devices而不使用this.devices

<ion-slide *ngFor="let device of devices">

最新更新