Sắp xếp nội dung của ArrayController

Question

Tôi có một số Ember.ArrayController có nội dung chưa được phân loại.

Tôi muốn biết nếu có thể sắp xếp nội dung của ArrayController mà không sử dụng thuộc tính mới.

tôi dĩ nhiên có thể tạo ra một tài sản mới:

App.MyArrayController = Em.ArrayController.extend({ 
    mySortMethod: function(obj1, obj2) { 
    // some code here 
    }, 
    updateSortedContent: function() { 
    var content = this.get('content'); 
    if (content) { 
     var sortedContent = content.copy(); 
     sortedContent.sort(this.mySortMethod); 
     this.set('sortedContent', sortedContent); 
    } 
    }.observes('content') 
}); 

Nhưng tôi hy vọng có một cách tốt hơn mà không trùng lặp nội dung.

Answer 1

CẬP NHẬT

Phiên bản mới nhất của Ember thực sự đã được sắp xếp sẵn. ArrayController hiện bao gồm Ember.SortableMixin sẽ tham gia nếu bạn chỉ định sortProperties (Mảng) và tùy chọn sortAscending (Boolean).

Lưu ý: với SortableMixin mới, bạn vẫn cần tham khảo arrangedContent để tải phiên bản đã sắp xếp. Bản thân mô hình sẽ không bị ảnh hưởng. (Cảm ơn Jonathan Trần)

App.userController = Ember.ArrayController.create({ 
    content: [], 
    sortProperties: ['age'], 
    sortAscending: false 
}) 

ORIGINAL ĐÁP

Cách đúng để làm điều này là sử dụng tài sản của arrangedContent ArrayProxy. Thuộc tính này được thiết kế để được ghi đè để cung cấp phiên bản được sắp xếp hoặc lọc của mảng nội dung.

App.userController = Ember.ArrayController.create({ 
    content: [], 
    sort: "desc", 
    arrangedContent: Ember.computed("content", function() { 
    var content, sortedContent; 
    content = this.get("content"); 
    if (content) { 
     if (this.get("sort") === "desc") { 
     this.set("sort", "asc"); 
     sortedContent = content.sort(function(a, b) { 
      return a.get("age") - b.get("age"); 
     }); 
     } else { 
     this.set("sort", "desc"); 
     sortedContent = content.sort(function(a, b) { 
      return b.get("age") - a.get("age"); 
     }); 
     } 
     return sortedContent; 
    } else { 
     return null; 
    } 
    }).cacheable() 
}); 

Answer 2

Bạn phải sắp xếp theo cách thủ công các mảng, bao gồm bất kỳ nội dung của bộ điều khiển mảng nào, trong Ember. Bạn luôn có thể thay thế content bằng mảng đã sắp xếp của mình thay vì giữ cả hai mảng.

Cập nhật

Dưới đây là một ví dụ về những gì tôi nghĩ rằng bạn đang tìm kiếm: http://jsfiddle.net/ud3323/yjs8D/

Update # 2

Cập nhật ví dụ này để sử dụng những thay đổi cái nhìn bối cảnh mới. https://gist.github.com/2494968

tay lái

<script type="text/x-handlebars" > 
Will Display and Sort by Age (after 2 sec)<br/><br/> 

{{#each App.userController}} 
    {{#view App.RecordView}} 
     {{name}} - {{age}} 
    {{/view}} 
{{/each}} 
</script> 

Javascript

App = Ember.Application.create({ 
    ready: function() { 
     Ember.run.later(this, function() { 
      Ember.run.later(this, function() { 
       App.get('userController').set('content', [ 
        Ember.Object.create({ name:"Jeff", age:24 }), 
        Ember.Object.create({ name:"Sue", age:32 }), 
        Ember.Object.create({ name:"Jim", age:12 }) 
       ]); 
     }, 2000); 
     Ember.run.later(this, function() { 
      // Make the controller's content sort again in reverse this time 
      App.userController.notifyPropertyChange('content'); 
     }, 4000); 
    } 
}); 

App.userController = Ember.ArrayController.create({ 
    content: [], 

    contentDidChange: Ember.observer(function(userCtr, prop) { 
     if(!Ember.empty(this.get('content'))) { 
      console.log('about to begin sort'); 
      this.sortContent(); 
     } 

     this._super(); 
    }, 'content'), 

    sort:"desc", 

    sortContent:function() { 
     var content = this.get("content"), sortedContent; 

     if (this.get("sort") == "desc") { 
      this.set("sort", "asc"); 
      sortedContent = content.sort(function(a,b){ 
       return a.get("age") - b.get("age"); 
      }); 
     } else { 
      this.set("sort","desc"); 
      sortedContent = content.sort(function(a,b){ 
       return b.get("age") - a.get("age"); 
      }); 
     } 

     this.set("content",sortedContent); 
    } 
}); 

App.RecordView = Ember.View.extend({});