Passing data on pushPage()



  • I am having trouble passing data on using pushPage(). I am following the example in the documentation here exactly: https://onsen.io/v2/docs/angular2/navigation.html.

    However when I include the PageParams object in the constructor of the pushed page, it throws an error saying: Supplied parameters do not match any signature of call target. Is the documentation wrong or am I not doing some thing right, heres the code.

    @ViewChild(OnsNavigator) private _navigator: OnsNavigator;
    ...
    this._navigator.element.pushPage(TestComponent, {id: "2"});
    
    import {PageParams} from "angular2-onsenui";
    ...
    export class TestComponent  {
      constructor(private _params: PageParams) {
        console.log(_params.data);    // Empty
      } 
    }
    
    

    _params.data is empty. Not sure why.


  • Onsen UI

    @gciluffo Looks like PageParams was renamed to Params in rc.16, but the document related wasn’t updated. Can you try that?



  • @Fran-Diox Thanks for the reply. I updated Onsen V2, it does not recognize ‘Params’ object. However, the error that I initially had went away. The problem now is that when I try to access the variable _params.data, there is nothing in the object. Any idea to why? I have updated the code in my question.



  • Answering my question here: [options] parameter for pushPage() needs to be written as:

    this._navigator.element.pushPage(TestComponent, {data: {id: "2"}}); 
    

    This way the pushed page has access to the data by calling PageParams.data.



  • How are you injecting Params into component?



  • @gciluffo Sorry, I don’t have a strong answer for you, but have you looked at this tutorial:

    http://tutorial.onsen.io/?framework=angular2&category=Reference&module=navigator

    Upon viewing the console, the data is there in object form.


Log in to reply