【问题标题】:Controller Strategy / Garbage Collection (destroy)控制器策略/垃圾收集(销毁)
【发布时间】:2012-04-20 04:44:25
【问题描述】:

试图为我的应用找出关于 MVC 的“ember 最佳实践”。也供参考,我正在使用 ember-data、ember-layout 和 ember-route-manager。

我以用户为例:

我想做的是从数据库中获取用户模型...然后将其包装在 UserController 中,并将模型设置为“内容”属性...然后在视图中,我想要为某些功能绑定到 controller,为模型级数据绑定到 controller.content。所以控制器可能看起来像:

App.UserViewController = Em.Object.create({   
    content: userRecord,
    isFollowingBinding : 'content.you_follow', 
    toggleFollow: function() { 
       make server call to change following flag 
    }
});

然后视图可以绑定到 {{controller.content.name}},或 {{#if controller.isFollowing}},或 { {action "toggleFollowing" target="controller"}}

但是说我从数据库中得到了一个用户模型列表...我觉得 应该 发生的事情是每个模型都应该用一个控制器包装,并且 应该作为一个列表返回...所以视图会有一个 UserControllers 列表

顺便说一句,我已经完成了这个......并且它工作得很好......除了每次我重新加载列表时,我都会用新控制器包装所有新模型对象......随着时间的推移,#内存中的控制器越来越大。在我的基本 Controller 类上,我正在记录对“destroy”的调用,但我没有看到它发生过

说到 Em.View... 我知道每次从屏幕上删除它时, .destroy() 都会收到调用(我也在记录这些调用)。所以如果我要将我的代码移动到一个视图中,我知道它每次都会被破坏并重新创建......但我不觉得像 toggleFollow() 这样的功能应该在视图中......

所以问题:

  • MVC 应该是这样工作的吗?包装在该模型的控制器中的模型的每个实例?哪里可以为一个屏幕创建大量控制器实例?
  • 如果我采用这种方法,那么我负责销毁()我创建的所有控制器?
  • 或者我上面描述的功能是否真的适用于视图,并且当它们从屏幕上添加/删除时,Ember 会创建/销毁它们?还允许模板设计者决定他们需要什么功能(如果他们只需要 {{user.name}},则无需实例化其他控制器/视图类......但如果他们需要“切换”按钮,然后他们可以将模板的那部分包装在 {{#view App.UserViewController contentBinding="this"}} )

我重写了几次...希望它有意义....

【问题讨论】:

  • 你能根据事件显式销毁吗?
  • 是的,我可以随时调用 UserViewController.destroy() ......所以我可以连接类似事件回调的东西,如果这是它应该完成的方式
  • Nick,我强烈建议你停下来花点时间观看 SproutCore 视频vimeo.com/user7276077/videos,尤其是第二个(关于核心概念)。客户端 MVC 与它的服务器端(或 Rails 等实现的)完全不同

标签: ember.js


【解决方案1】:

我不会将每个 user 包装到自己的控制器中。

相反,我会将用户绑定到一个视图,例如 App.UserView 并在该视图上处理 toggleFollow 操作。然后,此操作会将其操作委托给将处理服务器调用的控制器,请参阅http://jsfiddle.net/pangratz666/hSwEZ/

车把

<script type="text/x-handlebars" >
    {{#each App.usersController}}
        {{#view App.UserView userBinding="this" controllerBinding="App.usersController"}}            
            {{user.name}}
            {{#if isFollowing}}
                <a {{action "toggleFollowing"}} class="clickable" >stop following</a>
            {{else}}
                <a {{action "toggleFollowing"}} class="clickable" >start following</a>
            {{/if}}
            {{#if user.isSaving}}saving ...{{/if}}
        {{/view}}
    {{/each}}
</script>​

JavaScript

App.usersController = Ember.ArrayProxy.create({
    content: [],

    toggleFollowing: function(user) {
        user.set('isSaving', true);
        Ember.run.later(function() {
            user.toggleProperty('you_follow');
            user.set('isSaving', false);
        }, 1000);
    }
});

App.UserView = Ember.View.extend({
    isFollowingBinding: 'user.you_follow',
    toggleFollowing: function() {
        var user = this.get('user');
        var controller = this.get('controller');
        controller.toggleFollowing(user);
    }
});
​

【讨论】:

  • 这很有趣...我没想到会这样
猜你喜欢
  • 2019-06-07
  • 2010-10-24
  • 2011-10-27
  • 2017-12-16
  • 2017-11-02
  • 1970-01-01
  • 2023-04-03
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多