Trouble with tutorial - Angular 2
-
I’m having trouble with implementing the “Combining navigator and tabbar”-tutorial. I’ve implemented something that looks exactly like the example, but it’s not possible to switch “active” pages, and the active page(Home) isn’t showing its content either.
As far as I can see, your example doesn’t run on your tutorial page either.
Have you done any recent updates?
We’re also having another problem. When we have been testing we also had a lot of errors of the type “template parse errors”, when it’s an ambiguity which ons-page we are refering to, but how can we make an ons-page unique? We for example get the error when using the “Splitter outside navigator” tutorial.
-
@mwaandah The problem in the tutorial app is that those examples were still referencing
angular2-onsenui
library, which is the old version. They should point tongx-onsenui
correctly now. Looks like they work properly.
-
Thanks for your reply. I’m still having trouble with showing the content of the tabs and change the active tab.
Mobility component:
@Component({ selector: 'app', template: "<ons-navigator [page]='homePage'></ons-navigator>" }) export class MobilityComponent { homePage = Home; }
Home component:
@Component({ selector: 'ons-page', templateUrl: "./home.html" }) export class Home { explore = Explore; global = Global; homemylist = HomeMyList; constructor() { } }
Home.html
<ons-tabbar position="top"> <ons-tab label="Explore" [page]="explore" active="true"> </ons-tab> <ons-tab label="Global" [page]="global"> </ons-tab> <ons-tab label="My List" [page]="homemylist"> </ons-tab> </ons-tabbar>
Explore component
@Component({ selector: 'ons-page', //Tried with ons-page[explore] too. template: "<p> hallo </p>" }) export class Explore { constructor(private navigator: OnsNavigator) { console.log("EXPLORE") //Doesn't run } }
-
Seems like the problem is connected to that we used several components and just one module?