2014-06-05 8 views
0

ko.mapping을 사용하여 데이터를 뷰 모델로 변환하려고합니다. 결과는 웹 서비스에 대한 비동기 호출에서 비롯됩니다.

간단한보기를 다음과 같이

<div data-bind="with: myData"> 
    <div data-bind="text: mapWidth"></div> 
    <div data-bind="text: mapHeight"></div> 
    <div data-bind="foreach: priceRanges"> 
    <div data-bind="text: title"></div> 
</div> 

및 뷰 모델은 다음과 같습니다

var ViewModel = function() { 
    var self = this; 

    self.myData = null; 

    var data = { 
     action: 'GetPricePoints', 
     type: 'who cares' 
    }; 

    $.ajax({ 
     url: 'http://cdt.lotamore.com/api/imap', 
     data: { "": JSON.stringify(data) }, 
     //async: false, // works! 
     async: true, // doesn't work!!!!! 
     type: 'post' 
    }) 
    .done(function (data) { 
     self.myData = ko.mapping.fromJS(data); 
    }) 
    .error(function (data) { 
     alertError(data); 
    }) 
    .always(function() { 
    }); 
}; 

나는이 기적입니다 잘 작동 실행하면. 그러나 비동기 적으로 실행하면 내 뷰 모델 내에서 myData을 업데이트하지 않습니다.

은 내가 여기에 바이올린을 만들었습니다 http://jsfiddle.net/jgergen/jF9pm/20/

정말 UI 스레드를 차단 아약스 통화를 할 싶지 않아! 여기서 내가 뭘 잘못하고 있니? 나는이 모든 아닙니다

self.myData = ko.observable(); 

:

내가 라인 변경 :

self.myData = null; 

에를

감사합니다, 여기에

답변

1

짐은 솔루션입니다 유리한 결과없이 전에 이것을 시도했습니다. myData을 관찰 할 수있게하는 것 외에도 업데이트 방법을 변경해야했습니다.

.done(function (d) { 
     self.myData(ko.mapping.fromJS(d)); 
    }) 

그래서, 내가 무엇을 할 필요하면 내가 다른 모든 관찰로이 필드를 치료하는 것입니다 : 여기에 새로운 .done 방법이다.

이 새로운 바이올린에 여기를 볼 수 있습니다 http://jsfiddle.net/jgergen/jF9pm/47/

내가이 나보다 더 많은 도움이되기를 바랍니다. 결과없이 웹 전체에서이 문제에 대한 해결책을 모색했습니다. 그래서 여기 있습니다. 허위 사실 비동기가/당신을 트립 이유 당신이 관심이있을 수

+0

감사합니다, 짐 알 수 있습니다. 대답은 async가 false 일 때 ko.applyBindings를 실행할 때 myData에 값이 포함된다는 것입니다. async가 true이면 ko.applyBindings가 실행 된 후 myData가 업데이트됩니다. myData는 관찰 할 수 없기 때문에 바인딩은 null에 적용되고 비동기 호출이 완료되면 knockout은 변경 사항을 관찰 할 수 없습니다. – Paul

+0

@ 짐 그것이 갈 방법입니다 :) –

+0

당신이 나에게 묻는다면 생성자에서 데이터를 꺼내십시오. 초기 데이터를 가져온 후에 모델을 바인딩하는 클리너입니다. – Anders