보기에서 배열로 항목 추가 (backbone.js)

다 단계 마법사에서 복수 자식보기 ProductView이 포함 된 상위보기 ProductListView이 있습니다. 사용자가 ProductView을 클릭하면 해당 모델의 ID를 처리를 위해 서버 측으로 다시 보낼 수 있도록 어딘가에 (어레이 가능) 저장해야합니다.보기에서 배열로 항목 추가 (backbone.js)

문제 : 사용자가 클릭 한 의 id은 어디에 저장해야합니까? 부모보기 ProductListView에 저장하려고했으나 하위보기 ProductView에서 부모보기의 selectedProducts 배열에 액세스 할 수 없습니다.

올바른 방법입니까? 어떻게해야합니까?

모델

ProductCollection = Backbone.Collection.extend({ 
    model: Product, 
    url: '/wizard' 
});

부모보기

ProductListView = Backbone.View.extend({ 
    el: '#photo_list', 

    selectedProducts: {}, // STORING SELECTED PRODUCTS IN THIS ARRAY 

    initialize: function() { 
     this.collection.bind('reset', this.render, this); 
    }, 

    render: function() { 
     this.collection.each(function(product, index){ 
      $(this.el).append(new ProductView({ model: product }).render().el); 
     }, this); 
     return this; 
    } 
});

아이보기

ProductView = Backbone.View.extend({ 
    tagname: 'div', 
    className: 'photo_box', 

    events: { 
     'click': 'toggleSelection' 
    }, 

    template: _.template($('#tpl-PhotoListItemView').html()), 

    render: function() { 
     this.$el.html(this.template(this.model.toJSON())); 
     return this; 
    }, 

    // ADDS ITS MODEL'S ID TO ARRAY 
    toggleSelection: function() { 
     this.parent.selectedProducts.push(this.model.id); 
     console.log(this.parent.selectedProducts); 
    } 
});

출처

2012-09-03 Nyxynyx

내가생각하지 않습니다는 백본 View 유형의 속성입니다, 당신은 그것을 정의하지 않은, 그래서이 줄 일 것입니다 방법은 없다 :

this.parent.selectedProducts.push(this.model.id);

에 selected 속성을 추가하는 것입니다 올바른 접근 방법처럼 보인다는 Product 모델; 클릭 핸들러에서 해당 속성을 토글합니다. 그런 다음 서버에 제출할 때 선택한 항목에 대한 Products 컬렉션을 필터링하여 ID를 수집합니다 (Backbone에 포함 된 underscore.js를 사용하면이 작업을 쉽게 처리 할 수 있습니다).

출처

2012-09-03 02:37:43 McGarnagle

또한 @ dbaseman의 접근 방식을 취하고 각 모델에'selected' 속성이 있습니다. 마지막으로, 선택된 제품 모델의 배열을 얻기 위해'collection.filter (function (product) {return product.selected === true;})'를 수행하면됩니다. 당신이 원한다면 당신은 쉽게 id를 뽑을() 수 있습니다. 그러나 백본이 그대로있는 한, 배열을 푸는 방식 또한 잘못되었습니다. 자녀에게 부모보기의 참조를 전달하십시오. 'var childView = new ProductView ({ 'parent': parentView}); 그리고 당신은 당신의 parentView 배열에 접근 할 수 있습니다. – jmk2142

왜 모델에서 직접 선택한 정보를 유지하려고하지 마십시오. 따라서 선택한 사용 이벤트의 변경 상태를 쉽게 추적하고 추가 마법사 단계에서 해당 정보를 사용하게됩니까?

toggleSelection: function() { 
    this.model.set({ selected: true }); 
}

출처

2012-09-03 08:21:40

보기에서 배열로 항목 추가 (backbone.js)

답변

관련 문제