Skip to content

Support Binding GridLayout properties #278

@georgeedwards

Description

@georgeedwards

I would like to be able to specify the gridlayout position of an NG2 component with the standard binding syntax, however, the model outlined below doesn't work. Have I got something wrong, is there a work-around, or is this something we can work to support?

test.component.ts:

import {Component, Input} from "@angular/core";

@Component({
    selector: "test",
    templateUrl: `Components/Test/test.html`,
    providers: []
})

export class Test{
    @Input() labelRow: number;
    @Input() labelCol: number;
    @Input() labelColSpan: number;
    @Input() labelRowspan: number;
}

test.html:

<Image src="res://test" stretch="aspectFit" [row]="lableRow" [col]="labelCol" [colSpan]="labelColSpan" [rowSpan]="labelRowSpan6"></Image>

parent.html:

<GridLayout columns="*, *, *, *" rows="15*, 5*, 20*, 5*, 5*, 5*, 5*, 20*, 20*" width="100%" height="100%" style.backgroundColor="white">
    <test [labelRow]="2" [labelCol]="0" [labelRowSpan]="6" [labelColSpan]="2"></test>
</GridLayout>

The above displays the test component in my parent, however, it is located in the top left corner. If I manually set the grid positions statically in the test component, then the layout works fine.

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions