Knockout.js barre de progression largeur de json nombre

Question

J'ai un numéro tiré de json. En utilisant knockout.js je veux lire ce nombre et l'utiliser pour définir la largeur d'un div. Par exemple: un nombre de 50 équivaudrait à 50px de largeur sur div.

Comment faire pour créer une fonction dans knockout.js?

http://jsfiddle.net/infatti/zEWuZ/

<ul> 
    <li> 
    <span class="days-due" data-bind="text: daysDue"></span> days due 
    <div class="bar"></div> 
    </li> 
</ul> 

// Here's my data model 
var viewModel; 
$.getJSON('http://echo.jsontest.com/daysDue/50', function (data) { 
    viewModel = ko.mapping.fromJS(data); 
    ko.applyBindings(viewModel); 
}); 

edit: cela fonctionne dans mon violon maintenant, mais quelque chose ne tourne pas rond. Est-ce quelque chose à voir avec mes données.

// Here's my data model 
    var viewModel; 
    $(document).ready(function() { 
     $.getJSON('my/json', function (data) { 
      ko.mapping.fromJS(data.workflowItemViewModels, {}, viewModel.workflowItemViewModels); 

      viewModel = new DashboardViewModel(); 

      viewModel.barWidth = "width: " + data.dueDays + "px"; 

      ko.applyBindings(viewModel); 
     }); 
    }); 

Answer 1

est ici une façon possible comme exemple:

// Here's my data model 
var viewModel; 
    $.getJSON('http://echo.jsontest.com/daysDue/50', function (data) { 
    viewModel = ko.mapping.fromJS(data); 
    viewModel.barWidth = "width: " + data.daysDue + "px;"; 
    ko.applyBindings(viewModel); 
}); 

et se lient comme

<div class="bar" data-bind="attr: { style: barWidth }"></div>