2015-01-16 3 views
0

우리 팀은 Ember를 배우고 채택하여 우리의 어플리케이션을 구축했으며, 놀라운 여행을 해왔습니다. 사용자가 목록 맨 아래로 스크롤하면 자동으로 다음 페이지를 가져 오는 무한 스크롤 목록으로 점진적으로 데이터를 가져와야하는 시점이되었습니다. 우리의 REST 엔드 포인트는 이것을 수행하기 위해 Range 헤더가 전달 될 것으로 기대하고있다. 그렇지 않으면 최대 1000 개의 레코드를 리턴한다.Ember에 'Range'헤더 전달

지금까지 나는 다음과 같이 우리의 모델 별 어댑터 클래스의 헤더를 지정할 수 있습니다 것으로 나타났습니다 : 응용 프로그램이 다음로드해야하는 페이지 범위에 따라 변경해야하기 때문에

App.TaskAdapter = DS.RESTAdapter.extend({ 
    headers: function() { 
     return { 
      'Range': 'items=0-9' 
     }; 
    } 
}); 

내가 이렇게 될 클래스를 수정 :

이 수정으로
App.TaskAdapter = DS.RESTAdapter.extend({ 
    pageIndex: 0, 
    numRecords: 10, 

    headers: function() { 
     var pageIndex = this.get('pageIndex'); 
     var numRecords = this.get('numRecords'); 
     var rangeValue = 'items=' + (pageIndex * numRecords) + '-' + (((pageIndex + 1) * numRecords) - 1); 
     return { 
      'Range': rangeValue 
     }; 
    }.property().volatile() 
}); 

App.TasksRoute = Ember.Route.extend({ 
    ... 

    refreshModel: function(pageIndex) { 
     this.adapter.set('pageIndex', pageIndex); 
     this.store.find('task'); 
    }, 

    ... 
}); 

, 나는 01에 App.TaskAdapter 주입에 저를지도 한 (국도에서이 작업을 수행하여 pageIndexnumRecords을 수정할 수 있다고 기대했다). 그러나 this.adapter.set('pageIndex', pageIndex);은 값을 의도 한대로 설정하지 않았으므로 저장소에서 데이터를 가져와야 할 때마다 어댑터가 인스턴스화되었다고 생각하게되었습니다. 나는 이것에 완전히 틀릴지도 모른다.

내가 작동하지 못하기 때문에, 나는 보조자 클래스 TaskAdapterConfig (경로에 주입 됨)을 사용하여 행동을 수행하게되었습니다.

App.TaskAdapter = DS.RESTAdapter.extend({ 
    pageIndex: 0, 
    numRecords: 10, 

    headers: function() { 
     var pageIndex = this.config.get('pageIndex'); 
     var numRecords = this.config.get('numRecords'); 
     var rangeValue = 'items=' + (pageIndex * numRecords) + '-' + (((pageIndex + 1) * numRecords) - 1); 
     return { 
      'Range': rangeValue 
     }; 
    }.property().volatile() 
}); 

App.TaskAdapterConfig = Ember.Object.extend({ 
    pageIndex: 0, 
    numRecords: 10 
}); 

App.TasksRoute = Ember.Route.extend({ 
    ... 

    refreshModel: function(pageIndex) { 
     this.adapterConfig.set('pageIndex', pageIndex); 
     this.store.find('task'); 
    }, 

    ... 
}); 

더 좋은 방법이 있는지 궁금합니다. 내가 그렇게 대답을 용서해주십시오, 의견을 충분히 평판이없는

답변

0

...

내가 어댑터가 모든 요청에 ​​대해 다시 초기화되지 않은 것을 확인할 수 있습니다.

당신은 문제가 줄 this.adapter.set('pageIndex', pageIndex);과 함께 있었고 당신이 옳을 것이라고 말했습니다. 이것은 앱에 하나의 스토어가있는 것과 같은 방식으로 하나의 어댑터가 없기 때문입니다. 어댑터는 응용 프로그램 차원 (ApplicationAdapter) 또는 모델 특정 형일 수 있습니다. 상점에서 find() 호출을 수신 할 때마다 결국 호출 할 적절한 어댑터를 찾습니다.

따라서 응용 프로그램 전체 어댑터를 사용하는 경우 특정 어댑터 (this.ApplicationAdapter.set())를 참조해야합니다.

또는 모델 별 어댑터를 사용하는 경우 모델 자체를 참조 할 수 있습니다. this.store.adapterFor(type) 여기서 유형은 참조하는 DS.Model입니다. 프로그래밍 방식으로 모델을 얻으려면 this.modelFor('tasks')을 사용하여 DS.Model을 반환하면됩니다.

위의 방법 중 어느 것도 응용 프로그램에 적합하지 않은 경우이 예에서 만든 구성 개체와 같이 어댑터와 경로 모두에서 신뢰할 수있는 외부 클래스에 데이터를 저장할 수 있습니다.

관련 문제