Firebase Backfire 빠른 시작 가이드가 작동하지 않습니다.

Question

매우 기본적인 Firebase Backfire example application을 구현하려고합니다. 정확하게 정확한 JavaScript로 설명 된 html 페이지가 있습니다. 추가 버튼을 클릭해도 아무런 변화가 없습니다.

여기에 아주 분명한 내용이 없거나 예제 코드에 버그가 있습니까? 추가 버튼에 대해 onClick 핸들러가 표시되지 않습니다. 어떻게 작동 할 수 있습니까?

주 는 -이 게시물 에서 내 진짜 중포 기지 URL을 대체 - 예를 중포 기지 웹 사이트에이 this.todos = 새로운하여 ToDoList를 초기화하는 되었기 때문에 확실히() 버그를했다; 하지만하여 ToDoList 그래서 나는 그들이 TodoCollection() 을 의미 같은데요 ..... 어디에서나 존재하지 않습니다 - 어떤 종류의 자바 스크립트 오류가 크롬 HTML :

<div id="todoapp"> 
    <ul id="todo-list"></ul> 
    <input type="text" id="new-todo" placeholder="New Todo" /> 
    <button id="add-todo">Add</button> 
</div> 

자바 스크립트 :

// A simple todo model 
var Todo = Backbone.Model.extend({ 
    defaults : { 
     title : "New Todo" 
    } 
}); 
// Create a Firebase collection and set the 'firebase' property 
// to the URL of your Firebase 
var TodoCollection = Backbone.Firebase.Collection.extend({ 
    model : Todo, 
    firebase : "https://<myfirebaseurl>.firebaseio.com" 
}); 

// A view for an individual todo item 
var TodoView = Backbone.View.extend({ 
    tagName : "li", 
    template : _.template("<%= title %>"), 
    initialize : function() { 
     this.listenTo(this.model, "change", this.render); 
    }, 
    render : function() { 
     this.$el.html(this.template(this.model.toJSON())); 
     return this; 
    }, 
}); 

// The view for the entire application 
var AppView = Backbone.View.extend({ 
    el : $('#todoapp'), 
    initialize : function() { 
     console.log("AppView initialize") 
     this.list = this.$("#todo-list"); // the list to append to 
     this.input = this.$("#new-todo"); // the textbox for new todos 
     this.addBt = this.$('#add-todo'); // the button to add 
     // the data we are syncing from Firebase 
     // this is loaded as soon as the new TodoList has been created 
     this.todos = new TodoCollection(); 
     // by listening to when the collection changes we 
     // can add new items in realtime 
     this.listenTo(this.todos, 'add', this.addOne); 
    }, 
    addOne : function(todo) { 
     var view = new TodoView({ 
      model : todo 
     }); 
     this.list.append(view.render().el); 
    }, 
    createTodo : function(e) { 
     if (!this.input.val()) { 
      return; 
     } 
     // create a new location in firebase and save the model data 
     // this will trigger the listenTo method above and a new todo view 
     // will be created as well 
     this.todos.create({ 
      title : this.input.val() 
     }); 
     this.input.val(''); 
    } 
}); 
// Create a function to kick off our BackFire app 
function init() { 
    // The data we are syncing from Firebase 
    var collection = new TodoCollection(); 
    var app = new AppView({ 
     collection : collection 
    }); 
} 
// When the document is ready, call the init function 
$(function() { 
    init(); 
}); 

Answer 1

을

1. Firebase 웹 사이트의 예제에서 this.todos = new TodoList()를 초기화하려고했기 때문에 버그가 발생했습니다. TodoList는 어디에도 존재하지 않으므로 TodoCollection()으로 변경했습니다.

2. 단추의 onClick 처리기가 없으므로 추가했습니다. 다윗이 아침에 대한 수정에 넣어 같이

   events: { 
       "click #add-todo" : "createTodo", 
   },