2

私は現在、内部使用のためのレポート プラットフォームを構築しており、Ember.js を使用することにしました。これまでのところ、良い経験と悪い経験の両方がありました。悪い点は主にドキュメントに関連しており、オンラインで調査したほとんどのことが ember の最新リビジョンでどのように変更されたかです。

Twitter ブートストラップを使用しており、ブートストラップのナビゲーション部分には、要素ではなく要素のactiveクラスがあります。当然のことながら、私の最初の傾向は、jquery をハックとして使用し、アクティブなクラスを手動で変更することでした。これは完全に間違っていると感じ、「正しい」方法を見つけることにしました。lia

そのため、ナビゲーション用のカスタムビューを構築することになりました。以下を参照してください：（注：私はbrowserifyを使用しています）

// NavigationView.js
module.exports = Ember.View.create({
    templateName: 'navbar',

    // Bind the 'selected' property on this view to the controllers 'selected' property.
    selectedBinding: 'AnalyticsApp.NavigationController.selected',

    // a single sub item for the nav
    NavViewElement: Ember.View.extend({

      // Change the tag name to be a LI tag since bootstrap requires active class
      // to exist on that, instead of the default (ember) anchor tag when using {{linkTo}}
      tagName: 'li',

      // Bind the 'active' class to the computed property; checking if this nav
      // element is the current active tab.
      classNameBindings: ['isActive:active'],

      // This computed property will check if this nav item is active
      isActive: function() {
          return this.get('item') === this.get('parentView.selected');
      }.property('item', 'parentView.selected')

   })
});

さて、ビューの設定は非常に簡単でした。それを使用して nav 要素をレンダリングするには、これを使用できます。

{{#view view.NavViewElement item="network" }}
    {{#linkTo 'network'}}
        <i class="icon-sitemap"></i>
        <span>Networks</span>
    {{/linkTo}}
{{/view}}

メソッドのすべてのルートで、setupController「選択済み」タブを次のように設定しています

AnalyticsApp.NavigationController.set('selected', 'network');

ここで、実装に関して確信が持てません。誰かが目標から外れているか、正しい道を進んでいるかを教えていただければ幸いです。

私はNavigationController(以下の) をナビゲーション ロジックの中央ストアとして使用しObjectControllerて.create()います。

AnalyticsApp.NavigationController = Ember.ObjectController.extend({
  selected: null
}).create();

標準コントローラーを拡張しようとしましたが、それは set / get メソッドを公開しません。ObjectControllerこのタイプのセットアップに を使用するのは正しいタイプですか?

時間を割いて読んでいただきありがとうございます。すべてのフィードバックに感謝します。

-ライアン・S.

4

1 に答える 1

3

私のコメントは役に立ちましたので、回答に変換します。したがって、NavigationControllerアプリ全体で使用されるため、次のようにコントローラーを作成してみてください。

AnalyticsApp.NavigationController = Ember.ObjectController.create({selected:null});

それが役に立てば幸い

于 2013-05-17T20:52:28.910 に答える