0

ビューを削除する際に問題に直面しています。

ビューはナビゲーションバーとして使用されます

{{view "inner-form-navbar" navbarParams=innerNavObject}}

パラメータがこのように見える場所

 innerNavObject: {
        ...
        routeToReturn: 'someroute.index',
        ...
 },

ナビゲーション バーには、クリックすると親インデックス ルートが開かれる小さな「戻る」ボタンがあります。

現在、次のように機能します。

this.get('controller').transitionToRoute(routeToReturn);

しかし、これはコンポーネントでは機能せず、とにかく大雑把です。どういうわけかルーターをコンポーネントに注入する必要がありますか? または、誰かがこれに対する解決策を得ましたか? navbar は非常に多くの場所で使用されているため、navbarObject にプロパティを追加して特定のアクションを定義することは、本当に良い解決策ではありません。

このソリューションに行きました:

export default {
    name: 'inject-store-into-components',
    after: 'store',
    initialize: function(container, application) {
        application.inject('component', 'store', 'service:store');
        application.inject('component', 'router', 'router:main'); 
    }
};

今、私はできる

this.get('router').transitionTo('blah')
4

2 に答える 2

1

ルーティング機能を提供するサービスを使用してから、コンポーネントに注入することができます。

まさにそれを行うと思われるアドオンがあります-ember-cli-routing-service

あなたのシナリオに適応したリンクからの例:

export default Ember.Component.extend({
 routing: Ember.inject.service(),

 someFunc () {
   this.get('routing').transitionTo(this.get('innerNavObject'). routeToReturn);
 } 
});
于 2015-11-17T13:16:09.130 に答える
0

コンポーネントでルート/コントローラーを制御することは、通常、悪い習慣です。代わりに、ルートまたはコントローラーに存在するアクションが必要になります。その後、コンポーネントはそのアクションを送信でき、ルートまたはコントローラーはそれをキャッチします (データはダウン、アクションはアップ)。

コントローラーまたはルートには、遷移アクションがあります。

actions: {
  transitionFunction(route) {
    this.transitionTo(route);
  }
}

また、ルートまたはコントローラーで現在のルート名を定義し、それをナビゲーション バー コンポーネントに渡します。コントローラーは次のようになります。

export default Controller.extend({
  application: inject.controller(),
  currentRoute: computed('application.currentRouteName', function(){
    return get(this, 'application.currentRouteName');
  }),

  actions: {
    transitionFunction(route) {
      this.transitionTo(route);
    }
  }
});

次に、コンポーネントを呼び出して currentRoute CP を渡します。

{{nav-bar-component currentRoute=currentRoute action='transitionFunction'}}

次に、コンポーネントで、currentRoute から親ルートを見つける関数を使用できます。

export default Component.extend({
  click() { // or however you are handling this action
    // current route gives us a string that we split by the . and append index
    const indexRoute = get(this, currentRoute).split('.')[0] + '.index';
    this.sendAction('action', indexRoute);
  }
});

ルートの延長

あなたのコメントによると、これを複数のルートまたはコントローラーにまたがって使用したい場合があります。その場合は、1 つのルートを作成し、そこから他のルートを延長します。アクションを使用してルートを作成します (上記でコントローラーを作成したのと同じように)。次に、必要なルートにインポートします。

import OurCustomRoute from '../routes/yourRouteName';

export default OurCustomRoute.extend({
  ... // additional code here
});

その後、ルートは、最初のルートに設定されたすべてのアクションまたはプロパティにアクセスできます。

于 2015-11-17T23:36:21.360 に答える