Question

我正在使用LSAdapter，并尝试使加载事件正常工作。我发现这个奇怪的问题，加载事件似乎无法正常工作。

这是一个简单的页面。

- 当我们使用DS.FixtureAdapter时。加载事件工作正常 - 当我们使用DS.LSAdapter时。加载事件不起作用？

我犯了什么错误吗？

  <script type="text/x-handlebars" data-template-name="application">
    <h1>ember-latest jsbin</h1>
    {{outlet}}
  </script>

  <script type="text/x-handlebars" data-template-name="index">
    {{input value = newBookTitle action= 'newBook'}}
    <ul>
      {{#each}}
        <li>{{title}} </li>
      {{/each}}
    </ul>
  </script>

  <script type="text/x-handlebars" data-template-name="loading">
    <div id = 'global-loading'>
      <h2>GLOBAL LOADING</h2>
     </div> 
  </script>

  <script>
    App = Ember.Application.create({
      LOG_TRANSITIONS: true,
      LOG_VIEW_LOOKUPS: true
    });

    //Why does LSAdapter doesnot trigger the loading event?
    // App.ApplicationAdapter = DS.LSAdapter.extend({namespace: 'App-test-loading'});

    // FixtureAdapter works fine with loading event
    App.ApplicationAdapter = DS.FixtureAdapter.extend();

    App.Book = DS.Model.extend({
      title: DS.attr('string'),
    });

    App.Book.FIXTURES = [
        {
        id: 1,
        title: 'Learn Ember.js',
        },
        {
        id: 2,
        title: 'Nothing more'
        }
    ];

    App.ApplicationRoute = Ember.Route.extend({
      actions: {
        loading: function() {
          alert('laoding');
        }
      }
    });

    App.IndexRoute = Ember.Route.extend({
      model: function() {
          return this.store.find('book');
      }
    });

    App.IndexController = Ember.ArrayController.extend({
      newBookTitle:'',
      actions:{
        newBook:function(){
          var _nb = this.get('newBookTitle');
          if(!_nb) return ;

          var _book = this.store.createRecord('book',{
            id: Math.random().toString(32).slice(2).substr(0, 5),
            title: _nb
          });
          _book.save();

          this.set('newBookTitle', '');
        }
      }
    });

  </script>

_______ UPDATE _________

在@GJK的帮助下

我这样解决了：

   /*IndexRoute   model hook*/
  var books = this.store.find('book');
  return new Ember.RSVP.Promise(function(resolve) {
    Ember.run.later(function() {
      resolve(books);
    }, 10);
   });

也可以从

获得帮助

1 How do I create a promise in Ember.js for an Ember-data model

2 http://jsbin.com/ipehoj/1/edit

Answer 1

这是因为FixtureAdapter尝试模拟远程服务器而LSAdapter没有。 From the FixtureAdapter：

return this.simulateRemoteCall(function() {

Fixture适配器实际上等待一段时间，以更接近实际的服务器调用（这是FixtureAdapter的全部目的）。但是look at the LSAdapter：

return Ember.RSVP.resolve(record);

它返回一个几乎立即解决的promise，不会让你的load事件被调用。

LSAdapter应该是一个生产就绪的适配器，可以将您的数据存储在浏览器中。因为它存储在浏览器中，所以（几乎）没有加载时间。另一方面，FixtureAdapter应该模拟生产就绪的适配器，它将具有加载时间。他们的目的不同，你不应该互换使用它们。

为什么LSAdapter不会触发Ember.js中的加载事件？

1 个答案: