2013-02-03 4 views
1

이것은 .net mvc를 사용하여 knockout.js를 테스트 한 첫 번째 프로젝트입니다. 지금까지, 멋지다. 그런 다음스타일 요소의 녹아웃 바인딩

<div class="container"> 
<div data-bind="foreach: viewModel.items"> 
    <div class="well well-small"> 
     <div class="row"> 
      <div class="span9"> 
       <h3><span data-bind="text: Name"></span><small>&nbsp;Registered by <span data-bind="text: RegisteredBy"></span>at <span data-bind="text: Registered"></span></small></h3> 
       <p><span data-bind="text: Description"></span></p> 
      </div> 
     </div> 
     <div class="row"> 
      <div class="span6"> 
       <div class="progress"> 
        <div class="bar" data-bind="style: {width: progress }"></div> 
       </div> 
      </div> 
      <div class="span3"> 
       <span data-bind="text: progress"></span>% done <a class="btn btn-mini" href="#"><i class="icon-plus"></i>add 10%</a> 
      </div> 
     </div> 
    </div> 
</div> 

나는이 않는 :

<script> 
$(document).ready(function() { 
    var initialData = @(Html.Raw(Json.Encode(Model))) 
    viewModel = { items: ko.observable(initialData) }; 

    ko.applyBindings(viewModel); 

}); 

내가이 모든 시도하는 경우를 제외하고, 작동이 데이터 - 같은 바인딩

나는이보기가 바인딩 = "스타일 : {너비 : 진행}"

아래 범위에서 값을 얻었으므로 진행 필드가 작동 중임을 긍정적으로 나타냅니다.

아이디어가 있으십니까?

답변

2

단위를 지정해야합니다. {width: progress() + 'px'}과 같거나 단위로 반환하는 계산 된 관찰 가능 개체를 만듭니다.

+0

데이터 바인딩 = "스타일 : {너비 : 진행 + '%'}"은 매력처럼 작동합니다. 감사합니다. – espenk