0

在我的主页中，我有一个 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 调用后创建的视图

谁能指出我错在哪里。

4

1 回答 1

0

一旦您进入此路线，您的视图就会加载到插座中，它只是没有数据，直到被 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 来说明您当前正在做什么。

于 2013-10-11T01:54:29.627 回答