Ember.js 1.0-pre4 + jQ UI 可排序 + 本地存储适配器

Question

第 2 天学习 ember.js...

我正在开发一个离线应用程序，它需要将可拖动/可排序的磁贴位置保存到本地存储，如果没有现有数据，则从夹具加载和保存。

使用：ember 1.0.0-pre4、ember-data rev11、ember-localstorage-adapter、jQ 1.9、jQ UI 1.9 https://github.com/rpflorence/ember-localstorage-adapter

它有效，但我有点新手，觉得它不漂亮，可以使用一些社区建议。 http://jsfiddle.net/Nsbcu/4/

问题

1. 检查DS.Store 是否已加载且为空的正确方法是什么？我直接看localstorage的方法感觉不对。

2. 在我从App.Tile.DEFAULTScreateRecords 之后，我觉得我应该提交它们，但是抛出了一个错误。我不必提交已知的默认值，但很好奇导致错误的原因以及我应该如何正确提交。 App.ready() 回调也是加载默认值的正确位置吗？仅当localstorage 为空时才会发生错误

   Uncaught Error: Attempted to handle event loadedData on <App.Tile:ember231:1> while in state rootState.loaded.created.inFlight. Called with undefined

3. 在TilesController 上，我正在使用sortProperties，在jQ UI Sortable 更改DOM 并且Ember 想要更新我的磁贴顺序之前，我使用set 新的@987654332 之前效果很好@。我目前的解决方案是在更新模型时暂时关闭sortProperties。再次感觉这很 hacky，关于正确方法的建议？

=== 2 月 3 日编辑 ===

如果我执行异步提交，则可以避免问题 #2 中的初始错误。

App.TilesRoute = Ember.Route.extend({
    model: function() {
        return App.Tile.find();
    },
    setupController: function(controller) {
        if (localStorage.getItem('fusion-emberjs') == null) {
            App.Tile.DEFAULTS.forEach(function(item) {
                App.Tile.createRecord(item);
            });

            // Commit async, else generates error
            var _this = this;
            setTimeout(function() {
                _this.store.commit();
            }, 1);
        }
    }
});

Answer 1

• 我会将任何初始代码放入应用程序或 setupController 方法中的索引 Route

  if (localStorage.getItem('fusion-emberjs') == null) {
      App.Tile.DEFAULTS.forEach(function(item) {
          App.Tile.createRecord(item);
      });
  
      //*** WARNING: Generates Error ***/
      App.Tile.find().get('store').commit();
  }
  

• 在路线内移动代码后，将App.Tile.find().get('store').commit(); 替换为路线内的App.store.commit()

• 创建您自己的事务，而不是使用默认事务，每次直接调用商店时，您都在使用默认事务。您可以通过这种方式创建交易

var transaction = App.store.transaction()
transaction.createRecord(App.Foo);
transaction.commit()
transaction.rollback();

• 对 App.store 的任何调用都假定您已经创建了一个商店，现在您只是扩展 DS.Store。改为尝试

App.Store = DS.Store.create({
  revision: 11,
  adapter: 'App.LSAdapter'
});

• 我建议您在路由器中进行任何事件处理或事务管理，除非它纯粹是为了样式或动画。在这种情况下，视图是它的正确位置。我喜欢路由器来协调所有资产（控制器、路由、模型、视图）之间的通信

• 要记住的一个很好的模式是视图只与控制器对话，控制器只是模型的代理，路由器协调控制器之间的通信并管理路由。