emberjs: النموذج الأولي للوظيفة في التجزئة

Question

لدي أربع لوحات عمودية واجهة مستخدم:

• تعرض اللوحة الأولى القائمة وتتيح لك اختيار البيانات التي تريد عرضها
• تتيح لك اللوحة الثانية تحديد مرشح من قائمة المرشحات المحددة مسبقًا
• تتيح لك اللوحة الثالثة رؤية قائمة نتائج المرشح
• تتيح لك لوحة Forth عرض تفاصيل عنصر معين

لهذا واجهة المستخدم ، أستخدم الطرق المتداخلة والمنافذ:

App.Router.map(function() {
    this.resource('customers', { 'path' : '/customers' }, function() {
        this.resource('customers_filters', { 'path' : '/:filter' }, function() {
            this.resource('customer', { 'path' : '/show/:customer_id' });
        });
    });
});

كل شيء يعمل بشكل جيد ، لكن عندما أعرض تفاصيل عنصر معين (المسار الأخير في طرقي المتداخلة) ، فإن التجزئة في عنوان URL غير صحيح.

• المسار الأول موافق: #/العملاء
• المسار الثاني موافق: #/العملاء/الكل
• المسار الثالث KO: #/عملاء/مرشح الوظيفة () {[رمز أصلي]/show/2

وضعت مثالا على jsbin: http://jsbin.com/inagavo/1

ما الخطأ الذي افعله ؟ شكرًا لك

Answer 1

المشكلة هي أن Ember يبني عنوان URL استنادًا إلى النماذج لكل مسار. عندما تحاول بناء المسار أسفل المسار النشط/كله ، فإنه يستخدم مجموعة العناصر الخاصة بك (الذي لا يحتوي على حقل عليه يسمى المرشح) حتى لا يعرف كيفية تحديد ما إذا كان لديه حاليًا/مرشح نموذج. الممارسة الجيدة هي أن يكون لديك Slug (القيمة: في المسار) مطابقة الخاصية على النموذج.

إذا لم يتطابق مع ذلك ، فيمكنك تجاوز طريقة تسلسل في الطريق ، لذلك يعرف Ember كيفية إجراء تسلسل نموذجك لعنوان URL.

App.CustomersFiltersRoute = Ember.Route.extend({
  model: function(params) {

    if(params.filter == "active") {
      return _.where(App.Customers, {isActive: true});
    }

    return App.Customers;
  },

  serialize: function(model){
    if(model === App.Customers){
      return {filter:'all'}; 
    }
    return {filter:'active'};
  }
});

http://jsbin.com/inagavo/6/edit