로컬 데이터가있는 BackboneJS REST API

Question

다음과 같이 BackboneJS 모델/컬렉션이 있습니다.

var PersonInfo = BaseModel.extend({ 
    idAttribute: "PersonInfoId", 
    urlRoot: "api/outline/", 
    defaults: { 
     "name": null, 
     "class": null 
    } 
}); 


var PersonInfoCollection = BaseCollection.extend({ 
    url: "api/outline/", 
    model: PersonInfo 
}); 

는 지금은 응답/백엔드 데이터 (REST 호출)로 채워됩니다 그리드 그래서 내가 말을 가지고,

var personInfoCollection = new PersonInfoCollection(); 
myGrid.backboneRegColl(personInfoCollection); 

또한 제 방법은 다음과 같이 정의됩니다.

Grid.prototype.backboneRegColl = function(collection, parameters) { 
      var self = this; 
      collection.setServerParameters(pars); 

       collection.bind("dataReady", function(data) { 
        //Clear the grid data 
        self.clear(); 
        //Get data from collection 
        var data = collection.toJSON(); 
        //Render data from collection 
        self.renderData(data); 
       }); 
} 

또한 renderData는 아래와 같이 정의됩니다. 그리드 지역 JSON 데이터를 사용하여 제대로 채워 가져옵니다

Grid.prototype.renderData = function(data) { 

      var self = this; 

      //Empty data rows 
      this.el.find("tbody").empty(); 
      //get data from grid storage 
      var dataToRender = this.data; 

      //Override data to render from arguments 
      if(data != undefined) { 
       dataToRender = data; 
      } 
      if(dataToRender.length && ! $.isArray(dataToRender)) { 
       dataToRender = dataToRender.toArray(); 
      } 
      //If the dataToRender is an array 
      if($.isArray(dataToRender)) { 
       //If its an empty array 
       //XXX 
       if(dataToRender.length === 0) { 
        //Show no records message 
        _createEmptyRecordsMessage.call(this); 
       } 
       else { 
        //Render each row 
        $.each(dataToRender, function(index, dataRow) { 
         $frag.append(_createDataRow.call(self, dataRow)); 
        }); 
        $("tbody", this.el).append($frag); 
       } 
      } 
      //If the dataToRender is null, undefined or not an array 
      else { 
       //Show no records message 
       _createEmptyRecordsMessage.call(this); 
      } 

      //Resize is called to make sure header and data table widths are aligned 
      this._resize(); 

      function _createDataRow(data) { 
       var tr = $("<tr>").attr("tabIndex","-1"), 
       self = this; 

       //For each column in column definitions 
       $(this.cols).each(function(index, column){ 
        //Create a cell 
        var cell = $("<td>"); 
        var dataValue = $("<div>").html("-"); 
        if($.isFunction(column.renderer)) { 
         //Call the renderer and place the returned html|string into the data container 
         dataValue.html(column.renderer.call(data, $.extend(true, {}, column))); 
        } 
        else if(data[column.id] !== undefined && data[column.id] !== null) { 
         //Set the text of the data container to the data 
         dataValue.html(data[column.id]).attr('title', data[column.id]); 
        } 

        cell.append(dataValue); 

        tr.append(cell); 
       }); 

       //store the data for the row in the html row 
       tr.data(data); 

       return tr; 
      } 
     } 

이제 내 질문에 내가 REST API를 준비하지 않는 것입니다 ... 그래서 어떻게 내가 테스트합니까?

Answer 1

더미 데이터 테스트를 수행하려면 reset을 사용해보세요.

재설정 기능을 사용하면 컬렉션을 새 것으로 바꾸고 '재설정'이벤트를 트리거 할 수 있습니다. 테스트를 위해 더미 데이터를 할당하는 데 사용할 수 있습니다.

시도는 수집 OBJ에 '재설정'이벤트 리스너를 등록하려면

Grid.prototype.backboneRegColl = function(collection, parameters) { 
    var self = this; 
    collection.setServerParameters(pars); 

    collection.bind("reset dataReady", function(data) { 
     //Clear the grid data 
     self.clear(); 
     //Get data from collection 
     var data = collection.toJSON(); 
     //Render data from collection 
     self.renderData(data); 
    }); 
} 

그럼 리셋 함수를 호출하여 수집에 더미 데이터를 할당한다. (데이터 구조가 올바른지 확인하십시오)

personalInfoCollection.reset([{id:1,name:"Jimmy",tel:"123456"},{id:2,name:"Deemon",tel:"222222"}]); 

'재설정'이벤트가 트리거 된 후에보기가 올바르게 렌더링됩니다.