KoGrid JSON 동적 위젯

Question

저는 KOGrid를 사용하는 대시 보드에서 작업하고 있습니다. 제 생각은 동적으로 여러 위젯을 만들고 각 위젯의 kogrid에 데이터를 바인딩하는 것입니다. 문제는 녹아웃 바인딩으로, 내가 동적으로 DIV를 만들 때 view 모델에서 같은 것을 사용하여 myObsArray를 사용하고 있습니다. 이것은 모든 위젯이 동일한 데이터에 바인딩되도록합니다 (예 : 관찰 가능하고 데이터를 재정의 함). 모든 위젯의 마지막 위젯). 연관 배열을 통해이 문제를 해결하려는 모든 시도는 효과가 없습니다. 당신은 크게 감사드립니다. 미리 감사드립니다.

두 개의 컨트롤러 (MVC4)가 있습니다. 주먹이 위젯 이름 목록을 반환하고 두 번째 컨트롤러는 결과 (datatable)를 JSON 형식으로 반환합니다. JSON.Net JsonConvert를 사용하여 결과를 json 형식으로 변환 한 다음 JSON 컨텐츠 결과로 전달합니다. 하나의 위젯을 사용할 때 모두 잘되지만 문제는 둘 이상의 위젯을 사용할 때입니다.

function loadWidgets(data) { 
     //showLoading(); 
     var div1 = $("#db-col-1"); 
     var div2 = $("#db-col-2"); 
     div1.html(''); 
     div2.html(''); 
     $.each(data, function (index, item) { 

      var li = "<li id='" + item.WIDGET_NAME + "_li'></li>"; 
      if (index % 2 == 0) 
       div1.append(li); 
      else 
       div2.append(li); 

      $("#" + item.WIDGET_NAME + "_li") 
      .append("<div id= '" + item.WIDGET_NAME + "' class='example' data-  bind='koGrid: { data: myObsArray }'></div>"); //, 
      LoadJson(item.WIDGET_NAME, item.WIDGET_NAME + "Arr"); 

     }); 
    } 


    function LoadJson(widgetName) { 
     var wName = widgetName; 
     $.getJSON('Home/GetWidgetDetails?widgetName=' + wName, 
      function (data) { 
       window.viewModel = { 
         myObsArray: ko.observableArray(data) //myObsArray 
        };                 
        ko.applyBindings(viewModel); 
       });   
    } 

감사합니다, 샤시

Answer 1

첫째, 두 번 이상 호출 할 수있는 기능에 ko.applyBindings를 호출하지 않습니다. 이 호출은 뷰 모델 당 한 번만 발생해야합니다. 최근에 많은 일이 일어났습니다. 누군가가 나쁜 지침서를 어딘가에 가지고 있다고 생각하기 시작했습니다.

둘째,보기 모델을 덮어 쓰는 것이 문제입니다. 이 비트는 여기에 있습니다 :

window.viewModel = { 
    myObsArray: ko.observableArray(data) //myObsArray 
}; 

처음으로 호출 할 때 viewmodel이 생성됩니다. 두 번째 + 번, 그것은 당신의 viewmodel을 오버라이드합니다. 또한 프로그래밍 방식으로 HTML을 만드는 것은 불필요합니다. 넉 아웃은 foreach 바인딩을 사용하여이 작업에 더 적합합니다. 당신은 녹아웃이 있어야하는 것을 많이 놓치고있는 것처럼 보이므로, 그렇게하지 않았다면 the tutorials을 통해 진행하도록 권장 할 것입니다. 마지막으로 HTML이 유효하지 않게됩니다. 당신은 그들을 넣어 ol 또는 ul없이 li 노드를 만들고있다. 여기

는 문제, in a fiddle에 MVVM 솔루션입니다. 바인딩 개념을 보여주기 위해 단순화되었으며 koGrid을 사용하지 않습니다.