2016-03-24 9 views
3

はapp.htmlのため、次のレイアウトを考えると?私はtoggleSidebarのリンクをクリックしたときオーレリアナビゲーションバーでトリガーをクリックしてバインディング

<template bindable="router"> 
    <nav class="navbar navbar-default navbar-fixed-top" role="navigation"> 
    <div class="navbar-header"> 
     .... 

     <a class="navbar-brand" href="#" click.trigger="toggleSidebar()"> 
     <i class="fa fa-bars"></i> 
     <span>${router.title}</span> 
     </a> 
    </div> 

    .... 
    </nav> 
</template> 

は現在、私は次のエラーを取得する:

「toggleSidebarは関数ではありません」。

答えて

5

nav-bar.htmlでは、トグルメソッドの別のバインド可能なプロパティを追加します。バインド可能なプロパティは、データ/関数をカスタム要素と共有する方法です。これにより、カスタム要素がカプセル化され、移植可能になります。デフォルトのアクションは、(以下のように、私はあなたがあなたのtoggleSidebarメソッドからtrueを返す必要がかもしれないと思う

<nav-bar router.bind="router" toggle-sidebar.call="toggleSidebar()"></nav-bar> 

<template bindable="router,toggleSidebar"> 

はその後app.htmlで、ナビゲーションバーの要素に toggleSidebar方法をバインドリンク)はキャンセルされません。

+0

これは完璧に動作しました - ありがとうございます。私は長期的なDurandalユーザーの後で私の最初のアプリを作って、Aureliaにちょうど新しいです。 – daveywc

+0

クール - これですべてが設定されている場合、回答を受け入れてください –

+2

'app.js'で' toggleSidebar() 'がどのように宣言されていますか?このパターンは私のために働いていません。私の場合は、ビュー内にテーブルコンポーネントがあります。テーブルには親ビューから呼び出す必要がある 'shuffle()'メソッドがあります。 –

関連する問題