Accessing NativeScript controls in Angular 2 with ViewChild

Josh redoes the basic 'hello world' app in Angular, demonstrating how to access and set control properties using ViewChild

    import {Component, ViewChild, ElementRef, AfterViewInit} from "@angular/core";
    import {Button} from "ui/button";
        selector: "my-app",
        templateUrl: "app.component.html",
    export class AppComponent implements AfterViewInit {
        @ViewChild("button") button: ElementRef;
        public counter: number = 16;
        public onTap() {
            let viewButton: Button = this.button.nativeElement;
            // sets the button text on each tap.
            viewButton.text = `${this.counter} taps left`;
            if (this.counter === 0) {
                viewButton.text = "Hoorraaay!";
        ngAfterViewInit(): void {
            // sets the button text after load
            let viewButton: Button = this.button.nativeElement;
            viewButton.text = `TAPS Left ${this.counter}`;
        <Label text="Tap the button" class="title"></Label>
        <Button #button text="TAP" (tap)="onTap()"></Button>