Injected Page is null

user_4501973 0
Viewed 650

After upgrading an angular nativescript project to the current versions of angular, typescript, tns, etc.. I'm getting a runtime error stating:

TypeError: Cannot set property 'actionBarHidden' of null at new AppComponent...

The code that previously worked to hide the action bar looks like this:

import {Page} from "tns-core-modules/ui/page";

export class AppComponent implements OnInit, AfterViewInit {

    constructor(page: Page) {
        page.actionBarHidden = true;
    }
}

Why is page null after the injection?

angular2-nativescript nativescript
3 Answers

In the earlier versions the root was always a Frame, so by default there will be a Page.

But with the latest version, you are allowed to define flexible root components and any number of frames (page-router-outlet) within your app. So there won't be a default Frame / Page created within app component. Page can be injected only into the components those are loaded inside the page-router-outlet.

user_10604230

If TLDR the above link, the quick fix for me was to replace:

<router-outlet></router-outlet> with <page-router-outlet></page-router-outlet>

in app.component.html

user_62385330

Moving code to ngOnInit solved it for me

user_22032290
Related