首页 文章

RadSideDrawer不工作Nativescript angular 2

提问于
浏览
1

我是nativescript的新手,因为我正在学习实现导航抽屉,我最后会遇到一些错误 .

register.html

<ActionBar title="Custom Title">

        <ActionItem ios.systemIcon="9" android.systemIcon="ic_menu_share_holo_light" (tap)="openDrawer()"></ActionItem>
    </ActionBar>
<RadSideDrawer #drawer>
        <template drawerSide>
            <StackLayout class="p bgc-white">
                <ListView  row="1">
                    <template let-item="item" let-i="index">
                        <StackLayout>
                            <Label text="WWW" class="page-name" ></Label>
                        </StackLayout>
                    </template>
                </ListView>
            </StackLayout>
        </template>
        <template drawerMain>
            <StackLayout class="m">
                <user-list></user-list>
            </StackLayout>
    </template>
</RadSideDrawer>

register.component.ts

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

@Component({
    selector: "register",
    templateUrl :"./pages/register/register.html"
})

export class RegisterComponent 
{
   @ViewChild(RadSideDrawerComponent) public drawerComponent: RadSideDrawerComponent;
    private drawer: SideDrawerType;
    constructor (private _changeDetectionRef: ChangeDetectorRef) {

    }

  ngAfterViewInit() {
       console.log(" FFFFF");
        this.drawer = this.drawerComponent.sideDrawer;

        this._changeDetectionRef.detectChanges();
    }
   public openDrawer()
   {
       this.drawer.toggleDrawerState();
   }
}

the following is the log i am getting

promiseReactionJob @ [native code] CONSOLE ERROR file:///app/tns_modules/@angular/core/bundles/core.umd.js:3481:36:ERROR CONTEXT:

CONSOLE ERROR文件:///app/tns_modules/@angular/core/bundles/core.umd.js:3482:36:[object Object]

CONSOLE ERROR文件:///app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:344:22:错误:错误:0:0引起:undefined不是对象(评估' this.drawerComponent.sideDrawer“)

1 回答

  • 0

    您是否将NativeScriptUiSideDrawerModule导入app.module?

    像这样的东西:

    import { NativeScriptUISideDrawerModule } from 'nativescript-telerik-ui/sidedrawer/angular';
    
    @NgModule({ 
        bootstrap: [ 
            AppComponent 
        ], 
        imports: [ 
            CoreModule, 
            NativeScriptModule, 
            PagesModule, 
            NativeScriptUISideDrawerModule // RIGHT HERE 
        ], 
    })
    export class AppModule { }
    

    它在“入门”文档中概述:http://docs.telerik.com/devtools/nativescript-ui/Controls/Angular/getting-started

相关问题