淘汰賽風格元素綁定

Question

這是我第一個使用.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); 

}); 

這一切工作，除非我嘗試綁定這樣的數據 - bind =「style：{width：progress}」

由於我在下面的跨度中獲得了該值，因此我肯定進度字段正在工作。

有什麼想法？

Answer 1

您需要指定一個單位。像{width: progress() + 'px'}或創建一個計算的觀察值，它返回單位。