NativeScript Snacks

        

import {
    Component,
    OnInit,
    Input,
    AfterViewInit,
    ElementRef,
    ViewChild
}                               from "@angular/core";
​
// UI
import {StackLayout}            from "ui/layouts/stack-layout";
import {GridLayout}             from "ui/layouts/grid-layout";
​
@Component({
    selector: "child-component",
    directives: [],
    providers: [],
    template: `
        <StackLayout #container
            orientation="horizontal"
            verticalAlignment="center">
​
            <Label
                text="Hello">
            </Label>
​
            <Switch
                checked="false">
            </Switch>
        </StackLayout>
    `
})
export class ChildComponent implements OnInit, AfterViewInit {
​
    // Elements
    @ViewChild("container") container: ElementRef;
    
    constructor(){}
​
    ngAfterViewInit(){
        // Assign the element in template to a variable
      	const container = this.container.nativeElement;
​		
		// GridLayout has static functions setRow and setColumn.
		// Pass in your element to these static functions and they will attach to the closest parent gridlayout
        GridLayout.setRow(container, 0);
        GridLayout.setColumn(container, 1);
        }
    }
}

		
        </code>
      </pre>
    </div>
  </li>
    
</ul>