2014-01-22 21 views
2

我正在使用Ember版本:1.2.1和Ember-Data 1.0.0-beta.5。當我使用.save()和Ember-Data時,查看閃爍然後消失

我正在使用FixtureAdapter來存儲我的數據。如果我使用.save()然後轉換到另一條路線,則新視圖會短暫顯示然後消失。

如果我不使用.save(),數據顯示就像我想要的那樣。我需要使用save(),因爲我需要稍後可以使用.find().findQuery()

你可以看到在行動here(與.save())和here代碼(不.save())。

下面是代碼.save() s。

車把:

<script type="text/x-handlebars"> 
<h2>Welcome to Ember.js</h2> 
{{outlet}} 
</script> 

<script type="text/x-handlebars" data-template-name="index"> 
<ul> <li> <button {{action loginGo on="click"}}>Login</button></li></ul> 
</script> 

<script type="text/x-handlebars" data-template-name="mainpage"> 
    Hello User! You have access to the following modules: 
    <ul> 
    {{#each modules}} 
     <li>{{name}}</li> 
    {{/each}} 
    </ul> 
</script> 

而這裏的JavaScript的:

App = Ember.Application.create(); 

App.Router.map(function() { 
    this.route('mainpage', { 
     path: '/mainpage' 
    }); 
}); 

/* The mainpage router returns an object with the user's modules */ 
App.MainpageRoute = Ember.Route.extend({ 
    model: function(){ 
     console.log("Insite the mainpage route, user had access to " + App.currentUser.get('modules').toArray().length + " modules"); 
     return { 
      modules: App.currentUser.get('modules') 
     }; 
    } 
}); 

/* Two stores. A User and the user's modules */ 
App.Store = DS.Store.extend({ 
    adapter: DS.FixtureAdapter 
}); 

App.User = DS.Model.extend({ 
    name: DS.attr('string'), 
    modules: DS.hasMany('module') 
}); 

App.Module = DS.Model.extend({ 
    name: DS.attr('string'), 
    user: DS.belongsTo('user') 
}); 

/* When the user clicks the login button their User object is created 
and assigned several modules, then we transition to the mainpage */ 
App.IndexController = Ember.Controller.extend({ 
    actions: { 
     loginGo: function() { 
      App.currentUser = this.store.createRecord('user', { 
       name: "Bob", 
      }); 
      App.currentUser.save(); 

      this.store.createRecord('module', { 
       name: "Module 1", 
       user: App.currentUser 
      }).save(); 

      this.store.createRecord('module', { 
       name: "Module 2", 
       user: App.currentUser 
      }).save(); 

      this.store.createRecord('module', { 
       name: "Module 3", 
       user: App.currentUser 
      }).save(); 

      console.log("Right before transitioning to route, user had access to " + App.currentUser.get('modules').toArray().length + " modules"); 

      this.transitionToRoute('mainpage'); 
     } 
    } 
}); 

點擊登錄按鈕將運行loginGo動作用來初始化一個用戶對象和3級模塊的對象。然後它轉換到主頁面路線,它應該返回3個模塊並將它們顯示在列表中。

回答

1

你應該等到用戶完成拯救添加模塊將其

http://jsfiddle.net/6Evrq/25/

 App.currentUser.save().then(function(){ 
      self.store.createRecord('module', { 
      name: "Module 1", 
      user: App.currentUser 
      }).save(); 

      self.store.createRecord('module', { 
      name: "Module 2", 
      user: App.currentUser 
      }).save(); 

      self.store.createRecord('module', { 
      name: "Module 3", 
      user: App.currentUser 
      }).save(); 

      console.log("Right before transitioning to route, user had access to " + App.currentUser.get('modules').toArray().length + " modules"); 

      self.transitionToRoute('mainpage'); 
     }); 
+0

非常明顯回想起來之前,謝謝。 – stuporglue

相關問題