BackboneJS - 컬렉션을 가져 오는 동안 진행률 막대를 추가하는 방법

목록에서 편지를 클릭하여 다른 모음을 가져 오는 Backbone App이 있습니다. 그래서 Progressbar 나 어떤 종류의 회전 이미지를 추가하고 싶습니다. 그러나 이것을 수행하는 방법을 모릅니다.BackboneJS - 컬렉션을 가져 오는 동안 진행률 막대를 추가하는 방법

내보기 그래서 사람이 어떻게 이렇게하는 아이디어가 않습니다이

function (App, Backbone) { 

    var Artists = App.module(); 
    var ArtistView = Backbone.View.extend({ 
     tagName : 'li', 
     template: 'artistItem', 
     serialize: function() { 
      var data = this.model.toJSON(); 
      data.letter = this.model.collection.letter; 

      return data; 
     }, 
    }); 

    Artists.View = Backbone.View.extend({ 
     tagName : 'ul', 
     className : 'artistList', 
     initialize: function() { 
      this.listenTo(this.collection, 'all', this.render); 
      this.listenTo(App, 'navigateLetter', this.updateState); 
     }, 
     beforeRender: function() { 
      var self = this; 

      this.collection.each(function(item) { 
       self.insertView(new ArtistView({model: item})) 
      }) 
     }, 
     updateState: function(letter) { 
      this.collection.letter = letter; 
      this.stopListening(this.collection); 
      this.collection.fetch(); 
      this.listenTo(this.collection, 'all', this.render); 
     } 
    }); 
    Artists.ArtistsCollection = Backbone.Collection.extend({ 
     url: function() { 
      return '/projects/mdk/index.php/api/artists/' + this.letter; 
     } 
    }); 

    return Artists; 
});

처럼 보인다? 초기화 또는 beforeRender에서 뭔가를해야한다고 생각할 수 있습니까? 사전

출처

2014-02-25 SHT

에서

덕분에 이것 좀 봐 : https://github.com/davidsulc/marionette-gentle-introduction/blob/master/assets/js/apps/contacts/list/list_controller.js#L4

그것은 아이디어가 바로로드 뷰를 표시하는 것입니다 내 Marionette book 앱에서, 그리고 컬렉션 가져올 때, 실제보기를 렌더링 (그리고 마리오 네트가 취급하는 적재보기를 닫음). 그것은 (의사) 같은 것을 줄 것이다 :

var loadingView = new ContactManager.Common.Views.Loading(); 
    ContactManager.mainRegion.show(loadingView); 

    var fetchingContacts = myCollection.fetch(); 

    $.when(fetchingContacts).done(function(contacts){ 
    ContactManager.mainRegion.show(new MyCollView({ collection: contacts })); 
    });

코드는 컬렉션이 페치 (따라서 새로운 뷰가 표시되어야합니다)하고있다시기를 결정하는 이연 사용합니다. 여기 deferreds을 사용하는 방법에 대해 자세히 알아볼 수 있습니다 :

출처

2014-02-25 08:57:09

당신은 로딩 효과를 스피너를 사용할 수 있습니다. 이를 위해 해당 메인 파일에 spin.js의

spin.js

이 항목을 추가해야합니다.

해당 스피너를 사용합니다.

var yourSpinner = new Spinner(); 
var target = document.getElementById('spinHere'); 
yourSpinner.spin(target);

예 : 귀하의 경우 updateState:function(){}을 :

updateState: function(letter) { 
    this.collection.letter = letter; 
    this.stopListening(this.collection); 
    var yourSpinner = new Spinner(); 
    var target = document.getElementById('spinHere'); 
    yourSpinner.spin(target); 
    this.collection.fetch(); 
    yourSpinner.stop(); 
    this.listenTo(this.collection, 'all', this.render); 
}

출처

2014-02-25 08:59:12 Nakul91

BackboneJS - 컬렉션을 가져 오는 동안 진행률 막대를 추가하는 방법

답변

관련 문제