2012-12-05 2 views
3

AJAX를 통해 데이터를 받고 페이지에 표시하려고합니다. ajax 요청은 성공적이지만 knockout은 뷰를 업데이트하지 않습니다. 무엇이 문제 일 수 있습니까?Knockout.js, CoffeeScript 및 jQuery ajax가 텍스트 필드를 업데이트하지 않습니다.

소스 코드 :보기 모델

class AppViewModel 
    constructor: -> 
    @company = ko.observable {name:'n/a', tariff:'n/a', contract:'n/a', balance:'0'} 
    @getBriefInfo() 
    @companyTariff = ko.computed => "Tariff: #{@company.tariff}" 
    @companyBalance = ko.computed => "Total: #{@company.balance}" 


    getBriefInfo: -> 
    $.ajax 
     type: 'POST' 
     url: '/index.php/site/getCompanyShortInfo' 
     data: {} 
     dataType: 'json' 
     contentType: 'json' 
     success: (res) => 
      console.log @company(), res.name, res.tariff 
      @company res 
      console.log @company(), res.name, res.tariff 

$ -> 
    ko.applyBindings(new AppViewModel(),document.getElementById("company-info")) 

소스 코드 :보기

 <ul id="company-info" class="unstyled company-info"> 
     <li data-bind="text: company.contract"></li> 
     <li data-bind="text: company.name"></li> 
     <li data-bind="text: companyBalance"></li> 
     <li data-bind="text: companyTariff"></li> 
    </ul> 

답변

3

company 속성이 아닌 속성 관측이다. 속성에 직접 바인딩하므로 회사 개체가 변경 될 때 변경 사항이 표시되지 않습니다.

with 바인딩을 사용하면 벗어날 수 있습니다. 회사가 변경되면 내용이 업데이트됩니다.

<ul id="company-info" class="unstyled company-info"> 
    <!-- ko with: company --> 
     <li data-bind="text: contract"></li> 
     <li data-bind="text: name"></li> 
    <!-- /ko --> 
    <li data-bind="text: companyBalance"></li> 
    <li data-bind="text: companyTariff"></li> 
</ul> 

다른 속성을 중첩해야하는 경우 속성을 실제로 관찰 할 수 있도록 변경해야합니다.

+0

또한 'companyTariff'와'companyBalance' 계산 된 관측치를 업데이트해야만 회사를 읽고 적절한 속성을 읽을 수 있습니다. 그러나 나는 coffeescript를 쓰는 것을 이해하지 못한다. (JavaScript가 내가하는 일을 이해할만큼 충분히 가깝게 보인다. 직접 쓰지 않아도된다.) –

관련 문제