2013-04-12 31 views
9

Tôi đã tạo một ví dụ nhỏ để thử và làm cho nhiều mô hình hoạt động mà không có Dữ liệu Ember.Làm thế nào để bạn làm việc với nhiều mô hình trong Ember JS (không có Dữ liệu Ember)?

App = Ember.Application.create(); 

App.Router.map(function() { 
    this.resource('employees', function() { 
     this.route('employee'); 
    }); 
}); 

App.Employee = Ember.Object.extend({}); 

App.Employee.reopenClass({ 
    findAll: function() { 
     return $.getJSON("http://localhost/api/employee").then(
      function (response) { 
       var employees = []; 
       response.forEach(function (child) { 
        employees.push(App.Employee.create(child)); 
       }); 
       console.log(employees.join('\n')); 
       return employees; 
      } 
     ); 
    } 
}); 

App.EmployeesController = Ember.ArrayController.extend({}); 

App.EmployeesRoute = Ember.Route.extend({ 
    model: function() { 
     return App.Employee.findAll(); 
    } 
}); 

tay lái:

<script type="text/x-handlebars"> 
    <p>Application template</p> 
    {{#linkTo employees}}<button>Show employees</button>{{/linkTo}} 
    {{outlet}} 
</script> 

<script type="text/x-handlebars" data-template-name="employees"> 
    <p>Employees template</p> 
    {{#each controller}} 
    <p>{{Name}}</p> 
    {{/each}} 
    {{outlet}} 
</script> 

Khi tôi tìm đến localhost/#/employee url trực tiếp, nó hoạt động hoàn toàn tốt đẹp, nhưng khi tôi bấm vào nút "Hiển thị người lao động", tôi nhận được lỗi sau:

Uncaught TypeError: Object #<Object> has no method 'addArrayObserver' 

Tôi có thể thiếu thứ gì đó ở đâu đó, nhưng tôi không chắc chắn chính xác đối tượng nào mà lỗi đang đề cập đến ngay tại đó. Móc mô hình của tôi đang được gọi chính xác khi tôi nhấn nút, giống như khi tôi điều hướng bằng cách nhập thủ công url, vì vậy tôi không hiểu chính xác những gì khác nhau trong hai trường hợp được đề cập.

Trả lời

10

Cuối cùng, điều này hoạt động.

Lỗi của tôi là cố gắng tạo lại (đọc sao chép) Evil Trout's example khi thực hiện một ứng dụng Ember không có Dữ liệu Ember và không hiểu các khái niệm cơ bản cũng đủ.

Phương thức findAll của tôi đã trả về đối tượng Promise mặc dù bộ điều khiển mong đợi một mảng, do đó Uncaught TypeError. Những gì bạn cần làm là trả lại số trống ArrayProxy sẽ được điền khi nhận được phản hồi JSON.

App.Employee.reopenClass({ 
    findAll: function() { 
     var employees = Ember.ArrayProxy.create({ content: [] }); 
     $.getJSON("http://localhost:49441/api/employee").then(
      function (response) { 
       response.forEach(function (child) { 
        employees.pushObject(App.Employee.create(child)); 
       }); 
      } 
     ); 
     return employees; 
    } 
}); 

Nếu bạn trả lại chính xác mảng bằng phương pháp này, bạn không phải chỉ định rõ ràng bộ điều khiển là ArrayController.

Câu hỏi của tôi là ngớ ngẩn khi tôi biết mình đã làm gì sai, nhưng hy vọng nó sẽ giúp người khác bắt đầu.

Các vấn đề liên quan