백본 - localstorage를 사용하여 클릭 할 때 모델을 가져올 수 없습니다.

목록에 항목을 추가 할 수있는 백본에 작은 앱을 설치하려고합니다. 클릭하면 해당 항목이 삭제됩니다. 목록에 항목을 추가 할 수 있었지만 model.destroy()를 사용하면 아무 일도 일어나지 않습니다.백본 - localstorage를 사용하여 클릭 할 때 모델을 가져올 수 없습니다.

아이 : 내가 얻을 목록 모델에 클릭 이벤트를 CONSOLE.LOG

{CID : _changing, 개체 : "C0"는 속성을 거짓, _previousAttributes : 개체, 변경 : 개체 ...}

클릭하는 항목에 대해

코드는 다음과 같습니다 :

HTML :

<h1>INDEX!</h1> 

<form class="add-form"> 
    <input type="text" name="name"/> 
    <hr /> 
    <button type="submit" class="btn">Submit</button> 
</form> 

<h2>LIST STUFF</h2> 

<ul class="blah"> 
{{#each indexCollection}} 
    <li class="li-class">{{name}}</li> 
{{/each}} 
</ul>

자바 스크립트 :

//Local Storage 
App.Storage.Local = new Backbone.LocalStorage('localIndexList1-backbone'); 


//Index Model 
App.Models.IndexModel = Backbone.Model.extend({ 
    localStorage: App.Storage.Local, 
    defualts:{ 
    name:'' 
    }, 
    urlRoot: '/' 
}); 

//Index Collection 
App.Collections.IndexCollection = Backbone.Collection.extend({ 
    localStorage: App.Storage.Local, 
    model: App.Models.IndexModel, 
    initialize: function(){ 
    console.log('Collection initialised'); 
    }, 
    url: '/' 
}); 

//View for H1 and input form 
App.Views.IndexView = Backbone.View.extend({ 
    el: '.page', 
    events:{ 
    'submit .add-form' : 'addNew', 
    'click' : 'deleteMe' 
    }, 
    initialize: function(){ 
    console.log('IndexView initialised'); 
    }, 
    addNew: function(ev){ 
    // ev.preventDefault(); 
    var submitEntry = $(ev.currentTarget).serializeObject(); 
    var newEntry = new App.Models.IndexModel(); 
    newEntry.save(submitEntry, { 
     success: function(newEntry){ 
     // router.navigate('', {trigger: true}); 
     console.log('SUCESSS!!!!!!!!!'); 
     } 
    }); 
    }, 
    deleteMe: function(){ 
    console.log(this.model); 
    //Whatever I put here will not work 

    } 
}); 

//View for list 
App.Views.ListView = Backbone.View.extend({ 
    el: '.page', 
    initialize: function(){ 
    console.log('ListView initialised'); 
    }, 
    template: Handlebars.compile($('#list').html()), 
    render: function(){ 
    this.$el.html(this.template); 
    var that = this; 
    var indexCollection = new App.Collections.IndexCollection(); 
    indexCollection.fetch({ 
     success:function(indexCollection){ 
     that.$el.html(that.template({indexCollection: indexCollection.toJSON()})); 
     } 
    }); 
    } 
});

사람이 나에게 알려 도움을 줄 수 있을까 내가 잘못 갈거야?

감사합니다.

출처

2014-10-16 Blahh

각 컬렉션 모델에 대해 하나의 IndexView을 어디에 생성합니까? 항목보기가 있고 모델을 하나의 IndexModel로 구성한 다음 삭제 코드를 특정보기로 이동해야합니다. 그렇게하면이 항목보기에서 remove으로 전화해야합니다.

Backbone.Marionette와 같은 것이 많은 도움이됩니다. 그냥 CollectionView에 던져 당신은 끝났어. 이 같은 그것의

생각한다

"목록보기"-> 소장품이있다
"항목보기"-> 단일 모델에게 당신이에 필요

아무것도있다 콜렉션 레벨 (새 것을 추가하거나 다시로드하는 것과 같은)은 목록보기에서 수행하십시오. 모델 레벨에서 필요한 것 (편집, 저장, 삭제)은 항목보기에서 수행하십시오.

출처

2014-10-16 11:55:35 CharlieBrown

답변 해 주셔서 감사합니다. 따라서 목록보기는 모든 항목보기를 목록으로 렌더링해야합니다. – Blahh

정확히. 일반적으로 컬렉션의 모든 항목에 대해 다른보기를 렌더링하는 특수 유형의보기 인 CollectionView를 작성합니다. https://github.com/marionettejs/backbone.marionette/blob/master/docs/marionette.collectionview.md를 확인하십시오. – CharlieBrown

도움을 주셔서 감사합니다. – Blahh

백본 - localstorage를 사용하여 클릭 할 때 모델을 가져올 수 없습니다.

답변

관련 문제