NativeScript get CurrentPage


#1

I am trying to get a reference to the currentPage in a very specific place.

According to the tutorial i can just arrive at my ngOnInit() method and all the other angular lifecycle-hooks methods and get the page reference there and it all works fine i get no errors and i get the ViewById method working.

Code example:

    ngOnInit() {
        this.page.actionBarHidden = false;
        this.page.backgroundImage = "res://bitmap";
    }

    ngAfterViewChecked() {
        var htmlInitDate;
        htmlInitDate = this.page.getViewById("initialDateButton");
        if (typeof htmlInitDate == "undefined") {
            alert("Initial Date undefined!");
        } else {
            htmlInitDate.text = "3";
        }
    }

All this code works fine!

But when i am trying to acess the currentPage inside my component’s contructor i can’t get a Page reference.

code in my component:

import { Page } from "ui/page";
import { Component, OnInit, SimpleChanges } from "@angular/core";
import { registerElement } from 'nativescript-angular';
import { BottomBar, BottomBarItem, TITLE_STATE, SelectedIndexChangedEventData, Notification } from 'nativescript-bottombar';
import { User } from "../../shared/model/user/user";
import { UserService } from "../../shared/model/user/user.service";
import { Router, NavigationExtras } from "@angular/router";
import * as colorModule from "tns-core-modules/color";
import { RegisterComponent } from "../../pages/register/register.component";
import { ActivatedRoute } from "@angular/router";
import { DatePicker } from "tns-core-modules/ui/date-picker/date-picker";
import * as Calendar from "nativescript-calendar";
import * as frameModule from "tns-core-modules/ui/frame";
import * as pageModule from "tns-core-modules/ui/page";


@Component({
    selector: "dateTransaction",
    providers: [UserService],
    templateUrl: "pages/dateTransaction/dateTransaction.html",
    styleUrls: ["pages/dateTransaction/dateTransaction-common.css", "pages/dateTransaction/dateTransaction.css"]
})

export class DateTransactionComponent implements OnInit {
    public hidden: boolean;
    public titleState: TITLE_STATE;
    public _bar: BottomBar;
    public inactiveColor: string;
    public accentColor: string;
    public user: User;
    public beginDate: Date;
    public endDate: Date;


    constructor(private router: Router, private page: Page, private userService: UserService, private route: ActivatedRoute) {
        this.route.queryParams.subscribe(params => {
            if (params["beginDate"] != undefined) {
                this.beginDate = params["beginDate"];
                console.log("#######Date Transactions Begin Date: " + this.beginDate);
                this.ngAfterViewChecked();
            }
            if (params["endDate"] != undefined) {
                this.endDate = params["endDate"];
                console.log("#######Date Transactions End Date: " + this.endDate);
            }
            this.user = JSON.parse(params["user"]);
        })
        var htmlInitDate;
        htmlInitDate = this.page.getViewById("initialDateButton");
        if (typeof htmlInitDate == "undefined") {
            alert("Initial Date undefined!");
        } else {
            htmlInitDate.text = "3";
        }
    }

Inside the constructor, as soon as i execute this line of code:

htmlInitDate = this.page.getViewById("initialDateButton");

it is always returning undefined.

I also tried this method i saw when i tried searching the problem online:


I tried all the answers here and none of them work.

I think that i can’t get a Page reference inside the constructor because it loads the constructor before the Page. Am i right or wrong?
I basically need to get a Page reference at the contructor so i can pass Data information to the XML.