2016-11-21 3 views
-1
var view = { 
    displayTodos: function() { 
     var todosUl = document.querySelector('ul'); 
     todosUl.innerHTML = ''; 
     todoList.todos.forEach(function(todo){ 
      var todoLi = document.createElement('li'); 
      var todoTextWithCompletion = '' 
      if (todo.completed) { 
       todoTextWithCompletion = '(X) ' + todo.todoText; 
      } 
      else { 
       todoTextWithCompletion = '() ' + todo.todoText; 
      } 
      todoLi.textContent = todoTextWithCompletion; 

      todoLi.appendChild(this.createDeleteButton()); 
      todosUl.appendChild(todoLi); 
     }); 
    }, 
    createDeleteButton: function() { 
     var deleteButton = document.createElement('button'); 
     deleteButton.textContent = 'Delete'; 
     deleteButton.className = 'deleteButton'; 
     return deleteButton; 
    } 
}; 

Ich habe versucht, eine Schaltfläche, um jedes Element in meiner Liste hinzufügen, aber jetzt, wenn ich laufe view.displayTodos() erhalte ich die Fehlermeldung: „Typeerror: this.createDeleteButton ist keine Funktion "Javascript appendChild() Argument ist keine Funktion

Ich denke, das Problem hängt mit der Zeile zusammen: todoLi.appendChild (this.createDeleteButton()); aber ich weiß nicht, warum es nicht funktioniert.

Vielen Dank im Voraus für Ihre Hilfe

+2

der Zusammenhang von 'this' ist zu arbeiten, nicht das, was Sie denken, es ist. – epascarello

+0

Bitte fügen Sie einen MCVE (http://stackoverflow.com/help/mcve) hinzu. Wie Epascarello sagte, sieht es so aus, als ob Sie das Ausmaß von "diesem" missverstehen. – Marco

+2

Wahrscheinlich übergeben Sie 'view.displayTodos' als Funktion und verlieren' this'. Für dieses Beispiel ist die einfachste Lösung, 'this.createDeleteButton()' durch 'view.createDeleteButton()' zu ersetzen. –

Antwort

-1

einfachste Weg this zu that

var view = { 
 
    displayTodos: function() { 
 
     console.log("displayTodos",this); 
 
     var arr=[1,2]; 
 
     var that=this; 
 
     arr.forEach(function(todo){ 
 
    // console.log("todolist",this); 
 
     that.createDeleteButton(); 
 
     
 
     }); 
 
    }, 
 
    createDeleteButton: function() { 
 
     console.log("create"); 
 
    } 
 
    }; 
 
view.displayTodos();

zweite Methode :::: Führen Sie das aktuelle Objekt als zweite lösen speichern Parameter

var view = { 
 
    displayTodos: function() { 
 
     var arr=[1,2]; 
 
     
 
     arr.forEach(function(todo){ 
 
     
 
     this.createDeleteButton(); 
 
     
 
     },this); 
 
    }, 
 
    createDeleteButton: function() { 
 
     console.log("create"); 
 
    } 
 
    }; 
 
view.displayTodos();

1

this.createDeleteButton() mit view.createDeleteButton() ersetzen scheint

Dank Juan

Verwandte Themen