アウトレットを持つルート テンプレートと、ネストされた動的リソースがあります。ルート ビューの入力に名前を入力すると、ajax リクエストはネストされた動的リソースのモデルを非同期に取得し、そのモデルからの情報を使用してテンプレートをレンダリングします。ルートから開始し、入力を使用してネストされたリソースを呼び出すと、すべて正常に機能します。
したがって、すべてが完全に機能し、ネストされたリソースが URL を更新しますが、URL を更新またはナビゲーション バーに貼り付けると、空白のページが表示されます。エラーはありませんが、HTML はまったくありません。ajax リクエストが成功し、モデルが作成されたことを確認しました。私が知る限り、ルート テンプレートはレンダリングされていないため、ネストされたテンプレートには行き場がありません。
ember はこれを簡単かつ自動化するはずだと思っていましたが、ネストされたルートに直接行くときにルート テンプレートをレンダリングするにはどうすればよいですか?
ルーターは次のとおりです。
App.Router.map(function() {
this.resource('app', {path: '/'}, function(){
this.resource('user', {path: ':screen_name'});
});
});
App.IndexRoute = Ember.Route.extend({
setupController: function(controller, model) {
this.controllerFor('app');
}
});
App.UserRoute = Ember.Route.extend({
model: function(params) {
var that = this;
var promise = Ember.$.getJSON('/users/new?screen_name=' + params['screen_name']);
promise.then(fulfill, reject);
function fulfill (answer) {
return that.store.createRecord('user', answer);
}
function reject (reason) {
console.log("failure");
return false;
}
return promise;
},
serialize: function(user) {
return {screen_name: user.get('user.screen_name')};
}
});
は次のAppControllerとおりです。
App.AppController = Ember.ObjectController.extend({
actions: {
findUser: function(){
var that = this;
var name = that.get('screen_name');
that.set('screen_name', '');
that.transitionToRoute('user', name);
}
},
screen_name: ''
});
App.AppIndexController = Ember.ObjectController.extend({
needs: "app",
app: Ember.computed.alias("controllers.app")
});
は次のUserControllerとおりです。
App.UserController = Ember.ObjectController.extend({
needs: "app",
backgroundPic: function(){
return this.get('model.user.profile_banner_url');
}.property('model.user.profile_banner_url'),
profilePic: function(){
return this.get('model.user.profile_image_url');
}.property('model.user.profile_image_url')
});
モデルは次のuserとおりです。AJAX 要求によって返される JSON オブジェクトを受け入れるだけです。
App.User = DS.Model.extend();