AngularJS 2 + OnsenUI 2: interpolation doen't work directly
-
Hi there,
I’m woking with this template: https://github.com/monaca-templates/onsenui-v2-angular2-tabbar.
When I incorporate a variable in my class, and try to display this in the .html template with Angular interpolation method {{ var_name }} the variable won’t show.
However, when I also attach a function to an html element, and click this, then suddenly also the var is shown.
My modification to first.ts in the git repo mentioned above:
import {Component} from '@angular/core'; @Component({ selector: 'ons-page[first]', template: ` <div class="content"> <h4 (click)="test()">Click here</h4> <p >I am the first tab. {{testvar}}</p> </div> ` }) export class First { testvar = "koen"; constructor() {} test(){ console.log("test"); } }
What am I doing wrong? Is there an init method I need to call to make the layout active?
Thanks a lot!
Koen
-
@koenvanham Apologies for not being very well versed on Angular, but this tutorial has similar information for tabs: http://tutorial.onsen.io/?framework=angular2&category=Reference&module=tabbar
Maybe it will help!
-
@munsterlander thanks for the help. This tutorial is quite right, but it isn’t the implementation of tabs that is holding me back…
So far I know that this behaviour only occurs in Chrome. In my Safari browser it directly shows the text in the interpolators. Could the problem come from a cache somewhere in Chrome that I need to clear?
Thanks for your help!
-
@koenvanham Here there is another example without tabs. I think it’s the same as what you wrote so I’m not sure where’s the issue…