Backbone.js - 必須指定一個「url」屬性或函數

Question

我閱讀了關於這個參數的所有主題，但我不明白這段代碼是什麼，有幾個小時我試着去感受一下它：

它說：「未捕獲的錯誤：‘URL’屬性或功能必須指定」當我觸發事件保存並從TranslationView刪除。 我試圖找出其他代碼，但即使加上明確的url屬性設置爲它不工作集合...謝謝你在前進

/** 
* Translation Collection - The document 
* -- Collection of all translations in a document 
*/ 
var Document = Backbone.Collection.extend({ 
     model: Translation, 
     localStorage: new Backbone.LocalStorage("translations-db")  
    }); 
var Docs = new Document; 

/** 
* Translation View 
* -- A single language version 
* This is a version of translation 
*/ 

var TranslationView = Backbone.View.extend({ 
    template: _.template('<div class="cnt-translation"><span class="delete-btn">delete</span><span class="save-btn">save</span> Language: <input value="english" /><textarea id="translation_0" class="translation"></textarea></div>'), 

    events: { 
     'click span.delete-btn': 'remove', 
     'click span.save-btn': 'save' 
    }, 
     //'chnage ul#main-menu #add': 'addText' 

    initialize: function(){ 
     _.bindAll(this, 'render', 'unrender', 'remove','save'); 
     this.listenTo(this.model, 'destroy', this.remove); 
    }, 

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

    unrender: function(){ 
     $(this.el).remove(); 
    }, 

    remove: function(){ 
     console.log(this.model); 
     this.model.destroy(); 
    }, 

    save: function(){ 
     console.log(this.model); 
     this.model.save(); 
     console.log(localStorage); 

    } 

}); 


/** 
* Translation Main View 
* -- The Application 
* This is the top level piece of the app 
*/ 

var AppView = Backbone.View.extend({ 
    el: $('#application'), 
    type: 'localStorage', // in future also "remoteStorage" 

    events: { 
     'click #add_trans': 'createOnEnter', 
     'click #save_trans': 'saveTranslations', 
     'click #remove_trans': 'removeTranslation' 
    }, 

    initialize: function(){ 
     _.bindAll(this, 
     'render', 
     'saveTranslations', 
     'addTranslation' 
    ); 
     this.listenTo(Docs, 'add', this.addTranslation); 
     this.listenTo(Docs, 'all', this.render); 
     this.listenTo(Docs, 'reset', this.reloadAll); 
     this.render(); 
     console.log('initialized and texts loaded'); 
     Docs.fetch(); 
    }, 
    .... 

    render: function(){ 
     var self = this; 
     /* 
     _(this.collection.models).each(function(translation){ 
     self.appendTranslation(translation); 
     }, this); 
     */ 
    } 

    addTranslation: function(){ 
     console.log('addTrans called'); 
     var translation = new Translation(); 
     translation.set({ 
     id: 'translation_' + Docs.length, 
     language: 'english' // modify item defaults 
     }); 
     var translationView = new TranslationView({ model: translation }); 
     $(this.el).append(translationView.render().el); 
     console.log(Docs); 
    }, 

    createOnEnter: function(e) { 
     Docs.create({title: 'new trans'}); 
    } 


}); 


var ENTER_KEY = 13;  
var app = new AppView(); 
console.log(app); 
})(jQuery); 

Answer 1

你的問題是，您試圖保存/摧毀一個模型對象這從未與您的本地存儲支持收藏相關聯。

本地存儲插件首先查找模型上的localStorage財產，如果它發現沒有它看起來對模型的收集工作localStorage若仍無localStorage發現回退爲默認Backbone.Sync behaior這需要一個url等你拿例外。

而且因爲你創造你有一個無助的模型對象的addTranslation：

var translationView = new TranslationView({ model: translation }); 

但你並不需要這個，因爲調用此方法，當一個項目添加到您的收藏，你會得到新添加項目作爲參數。

你只需要改變你的方法使用該參數translation，而不是創建一個新的。

addTranslation: function(translation){ 
    translation.set({ 
     id: 'translation_' + Docs.length, 
     language: 'english' // modify item defaults 
    }); 

    var translationView = new TranslationView({ model: translation }); 

    $(this.el).append(translationView.render().el); 
},