JSFiddle - React, Tailwind, and code Playground

by manchagnu

HTML

<script src="http://ajax.aspnetcdn.com/ajax/knockout/knockout-2.1.0.js"></script>
<script src="https://raw.github.com/SteveSanderson/knockout.mapping/master/build/output/knockout.mapping-latest.debug.js"></script>
<div class='testContainer'></div>
<button class='updateState'>Update State</button>

JavaScript

var viewModel = ko.mapping.fromJS({
    type: 'good'
})

function getNewData(){
   
    var time = ((new Date()).getTime());

    return {
       type: ko.observable('bad')
    };
}
    
    
var templateData = '<div>' +
                    //'<span>&nbsp;</span>' +
                    '<!-- ko if: type() == "bad" || type() == "orange" -->' +
                    '<div>This should NOT be displayed</div>' +
                    '<!-- /ko -->' +
                    '</div>';

$('.testContainer').html(templateData);

ko.applyBindings(viewModel, $('.testContainer')[0]);

$('.updateState').on('click', function(){
    ko.mapping.fromJS(getNewData(), viewModel);
});