认沽计算值中的进度条淘汰赛JS

Question

我这里有一个计算值，

self.total_remain_percent = ko.computed(function() { 
      var x = 0; 
      var y = 0; 
      var z = 0; 
      var a = 0; 
      $.each(self.paymentPlan(), function (index, item) { 
       x += parseFloat(item.total_paid()); 
      }); 
      $.each(self.paymentPlan(), function (index, item) { 
       y += parseFloat(item.total_payment()); 
      }); 
      a = y-x ; 
      z = (a/y) * 100; 
      return z.toFixed(0); 
     }); 

，我需要证明它在一个进度条，我用淘汰赛观察到与进度条进行绑定，但我不能显示它，这里是进度条是如何完成的。

self.progress = ko.observable(10); 

<div data-bind="progress: progress"></div> 现在的进度条显示和价值也计算值显示100，

<span data-bind="text : $data.total_remain_percent"></span> 

但我需要证明这个总保持百分之，在进度条上，

我以这种方式尝试过，但没有工作

self.progress = ko.observable(self.total_remain_percent); 

和
self.progress = ko.observable(self.total_remain_percent()); 需要帮助把价值放在那里。

Answer 1

在一般说明中，请勿将您的变量称为x,y,z和a。

self.total_remain_percent = ko.computed(function() { 
    var totalPaid = 0; 
    var totalPayment = 0; 
    var remain = 0; 
    var remainPercent = 0; 
    ko.utils.arrayForEach(self.paymentPlan(), function (item) { 
     // Why aren't item.total_paid and item.total_payment numbers? 
     // There should not be any calls to parseFloat() here. 
     totalPaid += parseFloat(item.total_paid()); 
     totalPayment += parseFloat(item.total_payment()); 
    }); 
    remain = totalPayment - totalPaid; 
    remainPercent = remain/totalPayment * 100; 
    // this is all about numbers, so let's return a number (toFixed returns strings) 
    return Math.round(remainPercent); 
}); 

和

<div data-bind="progress: total_remain_percent"></div> 

应该做工精细，假设progress结合转动<div>成一个进度条表示。