离子:点击更改离子列表项目

假设我有 3 个列表

清单:1)公共汽车,飞机

清单: 2 ) [与公共汽车有关] 慢,不能飞

清单:3)【与飞机有关】速度快,能飞

在我的 Ionic Angular 项目中,我成功地制作了第一个离子列表。但是如何通过单击其中的项目来更改整个离子列表?

[我明白了,它与(单击)功能有关,但我如何使用打字稿影响整个列表]


猛跑小猪
浏览 88回答 1
1回答

UYOU

编辑:我得到你想要达到的目标。您可以通过创建一个中间列表并在您的ngFor. 这样,您只需将中间列表的引用更改为您喜欢的任何列表 onClickexport class ListPage {&nbsp; &nbsp;transportationTypes: string[] = ['bus', 'plane'];&nbsp; &nbsp;busSpecs: string[] = ['slow', "can't fly"];&nbsp; &nbsp;planeSpecs: string[] = ['fast', 'can fly'];&nbsp; &nbsp;currentList: string[] = this.transportationTypes;&nbsp; &nbsp;itemClicked(type): void {&nbsp; &nbsp; &nbsp; if (type === 'bus') {&nbsp; &nbsp; &nbsp; &nbsp; this.currentList = this.busSpecs;&nbsp; &nbsp; &nbsp; } else if(type === 'plane') {&nbsp; &nbsp; &nbsp; &nbsp; this.currentList = this.planeSpecs;&nbsp; &nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; this.currentList = this.transportationTypes;&nbsp; &nbsp; &nbsp; }&nbsp; &nbsp;}}在您的 HTML 中只需调用该itemClicked函数<ion-list *ngIf="currentList">&nbsp; <ion-item *ngFor="let item of currentList" (click)="itemClicked(item)">&nbsp; &nbsp; {{item}}&nbsp; </ion-item></ion-list>
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript