Nativescript：sideDrawerを論理的に制御する

Question

こんにちは！

私は、ナビゲーションバーの上に示されているNativescriptとJavascriptをとサイドの引き出しを作るしようとしています。

私が使用しているパッケージはTelerik Ui for Nativescriptです。

実際、スライドのジェスチャーを使用するときにナビゲーションバーに表示される引き出しを作成することができますが、tap="function()"指示からコントロールすることはできません。

• これはこれはこれはmain-page.xmlで私のコードですlogic control of the drawer

の公式ドキュメントですaction bars that are shown over the navigation

の公式ドキュメントです（私はnativescript-telerik-UIを使用ました無料版です。nativescript-telerik-ui-pro）

<dpg:DrawerPage loaded="pageLoaded" navigatedTo="onNavigatedTo" 
xmlns:dpg="nativescript-telerik-ui/sidedrawer/drawerpage" 
xmlns:drawer="nativescript-telerik-ui/sidedrawer" 
xmlns="http://www.nativescript.org/tns.xsd"> 
<navigation.actionBar> 
    <ActionBar title="Drawer Over Navigation" /> 
</navigation.actionBar> 

<dpg:DrawerPage.sideDrawer> 
<drawer:RadSideDrawer id="drawer"> 
    <drawer:RadSideDrawer.drawerContent> 
    <StackLayout cssClass="drawerContent"> 
     <StackLayout cssClass="headerContent"> 
     <Label text="Navigation Menu"/> 
     </StackLayout> 
     <ScrollView> 
     <StackLayout cssClass="drawerMenuContent"> 
      <Label text="Primary" cssClass="drawerSectionHeader" /> 
      <Label text="Social" cssClass="drawerSectionItem" /> 
      <Label text="Promotions" cssClass="drawerSectionItem" /> 
      <Label text="Labels" cssClass="drawerSectionHeader" /> 
      <Label text="Important" cssClass="drawerSectionItem" /> 
      <Label text="Starred" cssClass="drawerSectionItem" /> 
      <Label text="Sent Mail" cssClass="drawerSectionItem" /> 
      <Label text="Drafts" cssClass="drawerSectionItem" /> 
     </StackLayout> 
     </ScrollView> 
    </StackLayout> 
    </drawer:RadSideDrawer.drawerContent> 
</drawer:RadSideDrawer> 
</dpg:DrawerPage.sideDrawer> 

<StackLayout cssClass="mainContent"> 
    <Label text="{{ exampleText }}" textWrap="true" cssClass="drawerContentText"/> 
    <Button text="Toggle Drawer" tap="toggleDrawer" /> 
</StackLayout> 
</dpg:DrawerPage> 

そして、これは（toggleDrawer（）機能を実行）トグル引き出しボタンをタップしながら、私は取得していますエラーは次である私のmain-page.js

var drawer; 

exports.loaded = function(args) { 
var page = args.object; 
drawer = page.getViewById("drawer"); 
}; 
exports.toggleDrawer = function() { 
drawer.toggleDrawerState(); 
}; 

です：

TypeError: Cannot read property 'toggleDrawerState' of undefined.

多分あなたは私がここで何が起こっているのかを推測するのを助けることができました私はかなりこのエラーについて今混乱しています。

この問題を明確にするために提供できる追加情報を教えてください。

ありがとうございます！それはあなたはそれが何であるかに関係なく、をタップしたオブジェクトを取るようあなたは、任意のグローバルスコープに依存することはありませんように、あなたがこれを行うことができます=）

Answer 1

：

exports.toggleDrawer = function(args) { 
    var drawer = args.object; 
    drawer.toggleDrawerState(); 
}; 

Answer 2

私は最終的にそれを固定！私のロード "私のxmlのディレクティブはpageLoaded()ですが、その機能はありません！それはloaded()と呼ばれます。

だから私は「ロードされた」ディレクティブ修正する必要があります。

exports.loaded = function(args) { 
var page = args.object; 
drawer = page.getViewById("drawer"); 
}; 

---

または私は（ディレクティブコールを反映するために、関数の名前を変更することができ、関数の名前を反映するには

<dpg:DrawerPage loaded="loaded" navigatedTo="onNavigatedTo" 
xmlns:dpg="nativescript-telerik-ui/sidedrawer/drawerpage" 
xmlns:drawer="nativescript-telerik-ui/sidedrawer" 
xmlns="http://www.nativescript.org/tns.xsd"> 

をpageLoaded版）

<dpg:DrawerPage loaded="pageLoaded" navigatedTo="onNavigatedTo" 
xmlns:dpg="nativescript-telerik-ui/sidedrawer/drawerpage" 
xmlns:drawer="nativescript-telerik-ui/sidedrawer" 
xmlns="http://www.nativescript.org/tns.xsd"> 

&

exports.pageLoaded = function(args) { 
var page = args.object; 
drawer = page.getViewById("drawer"); 
}; 

---

あなたの助けありがとうございました！ = D