Как использовать плагин telerik ui для бокового ящика в приложении NativeScript

Я использую плагин Telerik UI в своем приложении NativeScript для реализации функциональности ящика. Для этого я следую этому руководству - https://www.nativescript.org/blog/details/using-cross-platform-native-sidedrawer-component-in-nativescript

Вот мой код-

import {Component} from "@angular/core";
import listViewModule = require("nativescript-telerik-ui/listview");
import drawerModule = require("nativescript-telerik-ui/sidedrawer");
@Component({
    selector: "my-app",
    template: `
<drawer:SideDrawer id="drawer1">
   <drawer:SideDrawer.mainContent>

        <!-- Place your page content here -->
        <StackLayout>
        <Label text="Tap the button" class="title"></Label>
        <Button text="TAP" (tap)="onTap()"></Button>
        <Label [text]="message" class="message" textWrap="true"></Label>
        </StackLayout>

       <StackLayout>
        <Button tap="openDrawer" text="ToggleDrawer"/>
       </StackLayout>
   </drawer:SideDrawer.mainContent>

   <drawer:SideDrawer.drawerContent>
     <StackLayout cssClass="drawerContent">
       <StackLayout cssClass="headerContent">
         <Label text="Drawer Header"/>
       </StackLayout>

       <StackLayout cssClass="drawerMenuContent">
         <Label text="Item 1"/>
         <Label text="Item 2"/>
         <Label text="Item 3"/>
         <Label text="Item 4"/>
       </StackLayout>

     </StackLayout>
   </drawer:SideDrawer.drawerContent>
</drawer:SideDrawer>
`,
})
export class AppComponent {
    public counter: number = 16;
    public get message(): string {
        if (this.counter > 0) {
            return this.counter + " taps left";
        } else {
            return "Hoorraaay! \nYou are ready to start building!";
        }
    }

    public onTap() {
        this.counter--;
    }
} 

Когда я запускаю это в своем эмуляторе, я получаю пустую страницу. Я использую AngularJS2 с машинописным текстом и совершенно новичок в обоих этих инструментах. Итак, не могу понять, что делаю не так.

Нужен путеводитель.


person Suresh    schedule 22.06.2016    source источник


Ответы (1)


  1. nativescript-telerik-ui \ listview и sidedrawer были до 2.0.0-rc.1, поэтому в настоящее время они работают над этим, вы можете проверить эту ссылку - https://github.com/telerik/nativescript-ui-samples-angular/issues/1#issuecomment-225791969

  2. если вы используете бета-версию angular, проверьте эту ссылку на репозиторий - https://github.com/telerik/nativescript-ui-samples-angular/tree/release/sdkAngular/app/sidedrawer

person Saurabh.Chaudhari    schedule 22.06.2016
comment
Спасибо за эту информацию. Я попробовал ваше второе предложение. Но, похоже, есть некоторая проблема в этой кодовой базе и команде Telerik, работающей над новым выпуском к концу этого месяца. https://github.com/telerik/nativescript-ui-samples-angular/issues/1. Итак, планируем подождать еще немного. - person Suresh; 22.06.2016