Ionic2动态设置栏项目

离子版本：2.1.8

我想在侧边栏动态添加的项目。

app.component.ts;

export class MyApp { 

    pages: Array<{title: string, component: any, icon: any }>; 

    this.pages = [ 
    { title: 'Dashboard', component: DashboardComponent, icon: 'ios-home-outline' }, 
    { title: 'Complaints', component: ComplaintPage, icon: 'ios-sad-outline' }, 
    { title: 'Suggestions', component: SuggestionPage, icon: 'md-bulb' }, 
    { title: 'Appreciations', component: AppreciationPage, icon: 'ios-thumbs-up-outline' }, 
    { title: 'Poll', component: PollPage, icon: 'ios-stats-outline' }, 
    { title: 'Survey', component: SurveyPage, icon: 'ios-analytics-outline' }, 
    { title: 'ReportIssue', component: ReportIssuePage, icon: 'ios-bug-outline' }, 
    ]; 

}

app.html

<ion-content> 
    <ion-list> 
    <button menuClose ion-item *ngFor="let p of pages" (click)="openPage(p)"> 
     <ion-icon item-left [name]="p.icon"></ion-icon> 
     {{p.title}} 
    </button> 
    </ion-list> 
</ion-content>

我想说明的投诉项目，如果投诉状态为 'NEW'。

那么，是否可以显示某些特定条件的投诉项目？我尝试ngIf但它不起作用。

什么是实现这种功能的最佳方式？

来源

2016-12-25 tushar balar

当你试图'* ngIf'又如何呢？ –

这个特定的条件可能会改变，然后在代码的其他部分？那么当这种情况发生时应该更新侧面菜单？ – sebaferreras

在组件中有一个变量来检查对方new的投诉。如果有的话，只需将该变量设置为true即可。

export class MyApp { 
    this.cmpltStatus; 
    if(newCmplnt){ 
     this.cmpltStatus = true; 
    } else{ 
     this.cmpltStatus = false; 
    } 
}

现在离子

<ion-content> 
    <ion-list> 
    <button menuClose ion-item *ngFor="let p of pages" (click)="openPage(p)" *ngIf=(!cmpltStatus && p.title==='Complaints')> 
     <ion-icon item-left [name]="p.icon"></ion-icon> 
     {{p.title}} 
    </button> 
    </ion-list> 
</ion-content>

来源

2016-12-26 10:03:48

它只会在用户启动应用程序时才起作用，并且当时它有新的投诉。但当用户使用该应用程序时添加新投诉时，该功能将无法使用。因为app.component.ts在应用程序启动时被调用。并且它的变量在应用程序加载后不会动态改变。我正在寻找解决方案，我们可以随时从任何其他ts页面添加项目。 – kabir

Ionic2动态设置栏项目

回答

相关问题