Как получить собственный элемент управления в RadSideDrawer с помощью nativescript angular2?

У меня есть RadSideDrawer, и я хочу применить директиву к элементу управления, который находится в MainContent RadSideDrawer. Вот мой компонент, использующий RadSideDrawer.

<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="[email protected]"></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>

And here is my directive. Directive

Затем я получил неожиданный ElementRef в методе ngOnInit директивы, чье свойство nativeElement не определено. Если вы можете мне помочь, я буду очень благодарен.


angular2-nativescript nativescript-telerik-ui
person Tao Zhu    schedule 06.03.2017    source источник
comment
Публикация изображений кода не рекомендуется и просто глупа, не говоря уже о том, что это также своего рода дерьмовый ход для тех, кто пытается помочь, потому что копирование и вставка невозможны. Я вижу, вы новичок, так что имейте это в виду на будущее, есть способ встроить код в ваши вопросы/ответы, используя язык уценки (документация здесь: stackoverflow.com/editing-help).   -  person Vladimir Amiorkov    schedule 14.03.2017
comment
@VladimirAmiorkov спасибо за ваше предложение, я обновил свой вопрос и буду помнить о том, что вы сказали.   -  person Tao Zhu    schedule 15.03.2017

Ответы (1)


arrow_upward
0
arrow_downward

Вы можете взглянуть на угловые примеры RadSideDrawer sdk плагина nativescript-telerik-ui здесь.

В частности, вы можете получить 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();
    }
}

Скопировано из здесь.

person Vladimir Amiorkov    schedule 07.03.2017
comment
Я имею в виду, что я могу получить элемент ящика, но не могу получить элемент в ящике. - person Tao Zhu; 13.03.2017
comment
Тогда перепишите свой вопрос, там нет упоминания о каком-либо содержимом бокового ящика. Экземпляр RadSideDrawer имеет свойства mainContent и drawerContent, в которых содержится объявленное содержимое. Вот документация по API (docs.telerik.com/devtools/nativescript-ui/api/classes/). - person Vladimir Amiorkov; 13.03.2017
comment
Я обновил свой вопрос, не могли бы вы взглянуть? - person Tao Zhu; 14.03.2017