Template: knockout

Template: knockout

by Salmin Skenderovic

HTML

<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<div class="carousel-inner col-sm-12" role="listbox" data-bind="foreach: dataSlides, as: 'slide'">
  
  <div class="item-2">
    <div class="col-sm-6" data-bind="foreach: $data">
    <!-- ko if: $index()+1 < $data.length / 2 -->
      <div data-bind="text: $data"></div>
    <!-- /ko -->
    </div>
  </div>
  
  <div class="item-2">
    <div class="col-sm-6" data-bind="foreach: $data">
    <!-- ko if: $index()+1 > $data.length / 2 -->
      <div data-bind="text: $data"></div>
    <!-- /ko -->
    </div>
  </div>
  
  <p>&nbsp;</p>
</div>

JavaScript

function vm() {
	this.name = ko.observable("salmin");
  
  self.dataSlides = ko.observableArray(
  [
      ['data 1a', 'data 2a', 'data 3a', 'data 4a', 'data 5a', 'data 6a'],
      ['data 1b', 'data 2b', 'data 3b', 'data 4b', 'data 5b', 'data 6b']
  ]);
  
};

var vm = new vm();
ko.applyBindings(vm);