Объект JavaScript теряет ссылку по функциям

Question

Я тестирую среду SAPUI5 с помощью небольшого списка приложений. У меня есть база данных и доступ к данным через службу REST. Я могу получить все в свой пользовательский интерфейс и из пользовательского интерфейса в базу данных.

Однако я сохраняю ссылку на данные базы данных в модели JSON, которая сопоставляется с таблицей, отображаемой в пользовательском интерфейсе. Когда я пытаюсь добавлять/удалять элементы, запись в базу данных, похоже, работает корректно, но моя переменная-модель перестает ссылаться на разные вызовы функций (например, «initToDoModel» и «addToDo»). Вот код:

sap.ui.controller("sapui5_test.SAPUI5_Test", { 

    //THIS IS THE REFFERENCE 
    todoModel : null,    

     addTodo : function(text) { 
      this.doAjax("/add", { 
       text : text 
      }).done(function(todo) { 

       //HERE todoModel IS UNDEFINED BUT WAS SET IN initTodoModel 
       this.todoModel.getProperty("/").push(todo); 
       this.todoModel.updateBindings(); 
       this.getView().rerender(); 
      }); 
     }, 

     initTodoModel : function() {  

      var oModel = new sap.ui.model.json.JSONModel(); 
      var aData = jQuery.ajax({ 
       type : "GET", 
       contentType : "application/json", 
       url : "http://sapm04.ibsolution.local:50000/demo.sap.com~d337_resttest_web/rest/todo/init/", 
       dataType : "json", 
       async: false, 
       success : function(data,textStatus, jqXHR) { 

        oModel.setData({modelData : data}); 

        //HERE THE todoModel IS SET 
        this.todoModel = oModel; 
        alert("Ok"); 
       } 

      }); 
      return oModel; 
     }, 

     doAjax : function(path, content, type, async) { 
      var params = { 
       url : "http://sapm04.ibsolution.local:50000/demo.sap.com~d337_resttest_web/rest/todo" + path, 
       dataType : "json", 
       contentType : "application/json", 
       context : this, 
       //async : false, 
       cache : false 
      }; 

      params["type"] = type || "POST"; 

      if (async === false) { 
       params["async"] = async; 
      } 

      if (content) { 
       params["data"] = JSON.stringify(content); 
      } 

      return jQuery.ajax(params); 
     }, 

     getTodo : function(id) { 
      var index, todo; 

      jQuery.each(this.todoModel.getProperty("/"), function(i, t) { 
       if (t.id === id) { 
        index = i; 
        todo = t; 
       } 
      }); 

      return { 
       index : index, 
       todo : todo 
      }; 
     } 

    }); 

поэтому функция initToDoModel вызывается каждый раз, когда страница загружена, получает данные из БД, отображает его в объект JSONModel. Затем, когда я нажимаю кнопку «Добавить» на моей странице, вызывается функция addToDo и ей необходимо обновить кэшированную JSONModel, которая пока не определена.

Я новичок в JavaScript, поэтому, возможно, кто-то может объяснить, что там происходит.

Answer 1

Вы можете console.log(this); внутри вашего обратного вызова AJAX - вы, вероятно, увидите, что он ссылается на объект window.

Вы можете сохранить ссылку на текущий объект, сохранив нужный контекст для this в переменной перед вызовом AJAX.

addTodo : function(text) { 
     var that = this; 
     this.doAjax("/add", { 
      text : text 
     }).done(function(todo) { 

      //HERE todoModel IS UNDEFINED BUT WAS SET IN initTodoModel 
      that.todoModel.getProperty("/").push(todo); 
      that.todoModel.updateBindings(); 
      that.getView().rerender(); 
     }); 
    },