ember 2.17でいくつかのパラメータでネストされたルートを使用する方法

Question

スマートフォンアプリを構築しようとしていますが、サーバーパラメータでネストされたルートを呼び出すことに悩まされています。ユーザーがログインしている親ルートのテンプレートの下に、私が家計を表示するための子ページをレンダリングしたいという情報を表示したい。特定の世帯が選択された後、私は家庭内の部屋を表示し、次にデバイスを表示します。これは私のrouter.js

Router.map(function() { 
     this.route('about'); 
     this.route('users', function() { 
     }); 
     this.route('households', { path: '/:user_id' }, function() { 
     this.route('index', { path: '/:user_id' }) 
     this.route('rooms',{ path: '/:household_id' }); 
     this.route('devices', { path: '/:room_id' }); 
     }); 
    }); 

export default Router; 

私はこの

<h3>{{#link-to "households" user.id}}{{user.surname}}{{/link-to}}</h3> 

、今私は燃えさしデータストアからユーザーを返すhouseholds.jsのルートでモデルを宣言したいような世帯へのリンクです親テンプレートをレンダリングします。その後、モデルはuser.idを使ってhouseholds.indexにリダイレクトする必要があり、households.index.hbsはすべての世帯を親テンプレートの下にレンダリングする必要があります。

export default Route.extend({ 
    model(params){ 
    { 
     return this.get('store').findRecord('user', params.user_id); 
    } 
    } 
}); 

この

export default Route.extend({ 
    model(params) { 
     return this.get('store').findAll('household').then(results => results.filter((site) => { 
      return site.get('member').filter(x => x == params.user_id).length > 0; 
     })); 
     } 
}); 

のように私のhousehold.indexルートは実際に次のエラーが発生します： マイhouseholds.jsルートは次のようになり、一般的に

Error: Assertion Failed: You attempted to define a {{link-to "households.rooms"}} but did not pass the parameters required for generating its dynamic segments. You must provide param user_id to generate .

私はのserveralを必要としますすべてのネストされたルート/サブルートのパラメータを使用する必要があります。たとえば、呼び出し側のユーザが管理者かどうかを確認するためにルートデバイスにuser_idが必要です。彼が管理者であれば、デバイスを追加したり編集したりすることができます。そして、選択した部屋にあるデバイスだけを表示するにはroom_idが必要です。

サーバパラメータを渡す方法やコントローラを使用する方法はありますか？私の目的は何ですか？

Answer 1

私の理解では、ルーティング階層はうまく設定されていません。

を使用すると、複数のユーザーを持つと仮定すると、すべてのユーザーが複数の世帯があり、各家庭に複数の部屋を持って、私はあなたがこのようなあなたのrouter.js作るお勧め：

Router.map(function() { 
    this.route('about'); 
    this.route('users', function() { 
    this.route('index'); // Lists all the users, URL looks like /users 
    this.route('single', { path: '/:user_id' }, function() { 
     this.route('index'); // Shows a single user, URL looks like /users/123 
     this.route('households', function() { 
     this.route('index'); // Shows all households a user with user_id has, URL looks like /users/123/households 
     this.route('single',{ path: '/:household_id' }, function() { 
      this.route('index'); // Shows a single household, URL looks like /users/123/households/456 
      this.route('rooms', function() { 
      this.route('index'); // Shows all rooms a household with household_id has, URL looks like /users/123/households/456/rooms 
      this.route('single', { path: '/:room_id' }); // Shows a single room, URL looks like /users/123/households/456/rooms/789 
      }); 
     }); 
     }); 
    }); 
    }); 
}); 

がでthis.route('index');ラインを省略すること自由に感じなさいあなたが望むならルータが、これを処理するためのルートを作っていることを確認してください。テンプレートは次のようになります。

// templates/users.hbs 

{{outlet}} 


// templates/users/index.hbs 

<h1>This shows all the users</h1> 

<ul> 
{{#each model as |user|}} 
    <li>{{user.name}}</li> 
{{/each}} 
</ul> 


// templates/users/single.hbs 

{{outlet}} 


// templates/users/single/index.hbs 

<h1>This shows a single user with id {{model.id}}</h1> 

<p>This is the user named {{model.name}}.</p> 


// templates/users/single/households.hbs 

{{outlet}} 


// ... And so on 

あなたは、彼らはあなたが本当に必要なものだけ取り出すようにmodel()フックを実装する必要があります。リストの場合は、表示するタイプのインデックスroute.js（ユーザーの場合はmodel()がroutes/users/index.js）、インデックスのではなく単一のレコードの場合は、route.jsという単一のレコード（つまり、単一のレコードmodel()の家庭、routes/users/single/households/single.js）を使用して、そのモデルをインデックスルートと子ルートの両方にアクセスできるようにします。

// All users 
{{#link-to 'users'}}All users{{/link-to}} 

// Single user 
{{#link-to 'users.single' user.id}}{{user.name}}{{/link-to}} 

// Households of a single user 
{{#link-to 'users.single.households' user.id}}All households of {{user.name}}{{/link-to}} 

// Specific household of a single user 
{{#link-to 'users.single.households.single' user.id household.id}}Household {{household.name}} of {{user.name}}{{/link-to}} 

// Rooms within a specific household 
{{#link-to 'users.single.households.single.rooms' user.id household.id}}All rooms within household {{household.name}} of {{user.name}}{{/link-to}} 

注：：非常に最初からあなたの人生を容易にするために、適切なモデルとそれらの関係を指定してください

ので、この構成では、あなたのリンクは次のようになります。だから、この答えの初めに想定した構成のための、あなたのモデルを作る必要があり、このような何か：

// models/user.js 

import DS from 'ember-data'; 

export default DS.Model.extend({ 
    name: DS.attr('string'), 

    households: DS.hasMany('household') 
}); 


// models/household.js 

import DS from 'ember-data'; 

export default DS.Model.extend({ 
    name: DS.attr('string'), 

    user: DS.belongsTo('user'), 
    rooms: DS.hasMany('room') 
}); 


// models/room.js 

import DS from 'ember-data'; 

export default DS.Model.extend({ 
    name: DS.attr('string'), 

    household: DS.belongsTo('household') 
}); 

あなたはこのようなモデルを整理する場合は、エンバーは（あなたが部屋のページからリンクさせますルート）を次のようにユーザーのページに追加します。

{{#link-to 'users.single' model.household.user}}Go to user{{/link-to}}