首页 文章

如何使用nativescript angular2在RadSideDrawer中获取本机控件？

提问于
浏览 次
0

我有一个RadSideDrawer，我想将一个指令应用于RadSideDrawer的MainContent中的Control . 这是我使用RadSideDrawer的Component .

<RadSideDrawer>
<StackLayout tkDrawerContent class="sideStackLayout">
    <StackLayout class="sideTitleStackLayout" backgroundGradient [gradientColors]="['red','blue']">
        <Image horizontalAlignment="center" class="avatar" src="res://avatar"></Image>
        <Label horizontalAlignment="center" class="name" text="Zeeko"></Label>
        <Label horizontalAlignment="center" class="email" text="1519560753@qq.com"></Label>
    </StackLayout>
    <StackLayout>
        <StackLayout orientation="horizontal">
            <Label [text]="'fa-file-text' | fonticon" class="fa icon"></Label>
            <Label class="side-item-lbl" text="我的简历"></Label>
        </StackLayout>
        <Label class="side-item-lbl" col="2" row="2" text="已投递"></Label>
    </StackLayout>
</StackLayout>
<StackLayout tkMainContent>
    <Button text="OPEN DRAWER" (tap)=openDrawer()></Button>
    <Label text="欢迎来到主页" textWrap="true"></Label>
</StackLayout>

这是我的指示 . Directive

然后我在Directive的ngOnInit方法中得到了意想不到的ElementRef，谁的 nativeElement 属性是未定义的 . 如果你能帮助我，我将非常感激 .

angular2-nativescript nativescript-telerik-ui

1 回答

  • 0

    您可以查看nativescript-telerik-ui插件here的RadSideDrawer sdk角度示例 .

    更具体地说，您可以在组件代码中获得 RadSideDrawerComponent ，如下所示：

    import { Component, ViewChild, AfterViewInit } from "@angular/core";
import { RadSideDrawerComponent, SideDrawerType } from "nativescript-telerik-ui-pro/sidedrawer/angular";

@Component({
    moduleId: module.id,
    selector: "tk-sidedrawer-getting-started",
    templateUrl: 'getting-started.component.html',
    styleUrls: ['getting-started.component.css']
})
export class SideDrawerGettingStartedComponent implements OnInit {
    constructor() {
    }

    @ViewChild(RadSideDrawerComponent) public drawerComponent: RadSideDrawerComponent;
    private drawer: SideDrawerType;

    ngAfterViewInit() {
        this.drawer = this.drawerComponent.sideDrawer;
    }

    public openDrawer() {
        this.drawer.showDrawer();
    }
}

    复制自here .

    回复于

相关问题