KnockoutJS를 늦게 바인딩하는 방법 관찰 가능

Question

일부 관찰 가능 항목과 바인딩이 적용된 후에 만 ​​알 수있는 속성이있는 ViewModel이 있습니다.

예를 들어, 내 UI는 아래 일치하는 검색 상자로 구성됩니다. 처음에는 첨부 할 데이터가 없기 때문에 뷰 모델 내부의 일치 항목에 대한 속성은 null입니다. 그러나 검색 창에 3 자 이상 입력하면 AJAX 호출이 만들어지고 데이터를 가져옵니다.

매핑 플러그인을 호출 할 때 호출에서 KO로 데이터를 매핑하기 위해 KO는 관측 가능한 배열을 늦게 바인딩 할 수 없습니다. 문제는 우선 바인딩을 설정하기 위해 매핑을 제공 할 수있는 것이 아무것도 없다는 것입니다.

내 코드 : 바인딩이 실행되면

var vm = new function() { 
     var self = this; 

     self.customers = null; 
     self.searchText = ko.observable(""); 

     self.searchText.subscribe(function (data) { 
      if (data.length > 2) { 
       // do search 
       $.get("/customers/getall", { searchTerms: self.searchText }, function (resp) { 

        if (!self.customers) { 
         // first mapping 
         self.customers= ko.mapping.fromJS(resp.customers); 
        } else { 
         ko.mapping.fromJS(self.customers, resp.customers); 
        } 
       }); 
      } 
     }); 

    } 

    ko.applyBindings(vm, $("#searchCustomersScope")[0]); 

Answer 1

는 KO로 만든 새로운 관찰 가능한 (템플릿 시나리오에서 제외)에 대해 알고 할 수 없습니다.

처음에는 빈 관측 가능 어레이로 self.customers을 만들고 나중에 매핑 플러그인이이를 업데이트하도록 허용 할 수 있습니다.

self.customers = ko.observableArray(); 
    self.searchText = ko.observable(""); 

    self.searchText.subscribe(function (data) { 
     if (data.length > 2) { 
      // do search 
      $.get("/customers/getall", { searchTerms: self.searchText }, function (resp) { 
        ko.mapping.fromJS(resp.customers, {}, self.customers); 
      }); 
     } 
    });