update elements after start app
alegomez89 opened this issue · comments
How to update the elements once they have been initialized?
Hi @alegomez89 . Could you please take a look at this issue? Basically the idea is to replace the options array with the modified options and that way Angular will know that the side menu should be updated.
Perfect! I updated the menu but did not define a new entire array for the options, now is very clear. Thank you!
Glad to hear that. Un abrazo!
Hi Seba, I tried to implement the method to update the menu items based on the user's permissions, but I did not have any results. In the app.components I declare the variable: public options: Array ;
I leave it empty inside the constructor. Once I am in the home (I also declare it in the same way) and inside the constructor I use the method: this.options = this.updateOptions ();
Which is detailed below:
private updateOptions (): Array {
let options: Array = [];
options.push ({
iconName: 'home',
displayName: 'Home',
component: HomePage,
selected: true,
});
var subItemsServices = [];
if (this.saleAccess === true) {
subItemsServices.push ({
iconName: 'logo-usd',
displayName: 'Sale',
component: SalePage
});
}
......
return options;
}
But when I enter the Home, the side menu is still empty. After reading your answer I still do not understand what I'm doing wrong, could you help me with this? Thank you very much!
From what I understand, you're updating a different array of options in your Home page. Basically the options array from the app.component.ts file should be updated because that's the array that is being sent to the component in the app.html file.
If you want to modify the side menu from the Home page (or any other page) you could use Ionic Events, like this:
// In your app.component.ts file
import { Events } from 'ionic-angular';
// ...
constructor(public events: Events) {
events.subscribe('sidemenu:update', (newOptions) => {
this.options = newOptions; // Replace the options array
});
}
And then in your page, send the new array of options using that event:
// In your home page...
import { Events } from 'ionic-angular';
// ...
public someMethod(): void {
let newOptions = this.methodThatObtainsTheNewOptions();
this.events.publish('sidemenu:update', newOptions);
}
By doing something like that, the options from the app.component.ts file will be replaced and the side menu should be updated.
You rock! Now work, thanks for the time ,I appreciate that. Abrazo!
Glad to hear that @alegomez89! Abrazo!