Best posts made by misterjunio

Thank you so much @munsterlander. I took the liberty of reusing your work and adapting slighly for AngularJS at another user’s request. The result is in this pen.

@Yohann3396 before turning to Onsen UI you should maybe understand Angular’s module and controller system on their own first.

In your example you probably only need one module with several controllers for your pages. What ons.bootstrap does is basically initialize a module for you so you don’t need to use ng-app, either use one or the other. You can also provide a module’s name as the first parameter of ons.bootstrap, (documentation here).

@Jearson-Batanes-Gomez if I understood what you want correctly you should be able to simply store a boolean hasDoneWalkthrough in the localstorage. Then you check it in the created hook and, if it’s false, you set this.pageStack = [Walkthrough], otherwise this.pageStack = [AppSplitter]. This will put the page you want at the top of the page stack and therefore on the screen.

@Jearson-Batanes-Gomez what I would do is use something like the localstorage for Vue plugin as in the topic you mentioned to permanently save whether the user has been through the walkthrough or not. Then in your AppNavigator I would use the created hook to check the localstorage and decide between Walkthrough and AppSplitter for the initial page in the pageStack.

@wetfeet check out this example.

@Rork I just made a PR that should fix it :smile: thanks for reporting and sorry for the delay.

@Aleksandr-Pchelin I was able to find a solution. You can access the tabbar element by giving it a variable in the view such as <ons-tabbar #myTabbar> and then declaring it as a ViewChild in the component with @ViewChild('myTabbar') tabbar; (as documented here).

The problem with the tabbar is that on the ngAfterViewInit() hook the elements are not initialized yet because they are loaded asynchronously so you need to access the DOM to set the active attribute with something like this.tabbar.nativeElement.querySelectorAll('ons-tab')[1].setAttribute('active', true).

Let me know if it worked for you :+1:

Hi everyone. I’m Júnio, the most recent intern working with the Onsen UI team. Following our last blog post we’ve been focusing on updating the binding for Vue2 in order to accomplish our established deadlines (and all your wildest dreams).

Click here to see the original article