ajax 响应后在插座中渲染视图答案

【问题标题】：Render a view in the outlet after ajax responseajax 响应后在插座中渲染视图
【发布时间】：2013-10-14 02:10:30
【问题描述】：

在我的主页中，我有一个 oulet watchListView，我只想用单击链接“/watch_lists”后得到的视图替换出口。

这是应用程序布局/模板的代码

 <div id='main-outlet'>
  {{outlet}}
  <div class="watch-list-rght"><a href="/watch_lists"><i class="icon-eye-open"></i></a>  </div>
 </div>
 {{outlet watchListView}}

这是应用程序路径中的代码

 this.resource('watchList', { path: '/watch_lists' });

这是 WatchList 路由器中的代码

 Discourse.WatchListRoute = Discourse.Route.extend({
   redirect: function() { Discourse.redirectIfLoginRequired(this); },
   renderTemplate: function() {
     this.render('watch_lists', { into: 'application', outlet: 'watchListView' });
   } 
 });

我只想在应用程序模板中添加 ajax 调用后创建的视图

谁能指出我哪里错了。

【问题讨论】：

你能组装一个 jsFiddle 吗？

标签： javascript ember.js outlet discourse

【解决方案1】：

一旦您进入此路线，您的视图就会加载到插座中，它只是没有数据，直到被 ajax 调用填充。将日志记录到 renderTemplate 函数中，您会看到。

我会在路由的 setupController 方法中进行 ajax 调用，使用该调用的结果填充控制器，以便您可以在视图中显示这些结果。有关详细信息，请参阅有关此方法的文档。

在 AJAX 回调中，您应该使用该调用的结果填充控制器，并在模板中使用指向您要显示的数据的句柄。当 Ajax 调用返回并填充控制器时，它将自动加载：

setupController:function(controller){
    someObj.AjaxCall(function(data){
        controller.set('data',data);
    }
}

您可以使用 {{controller.data.property}} 或 {{{controller.data.htmlProperty}}} 在 watchList 模板中查看控制器属性以呈现 html。

如果这还不够有用，请发布一个 jsfiddle 来说明您当前正在做什么。

【讨论】：