title: Uncaught TypeError: Object function () has no method items
body: <p>I am working with binding a json data in a ul tag. It shows that an error has occured .Here is the code:</p>
  
  <pre><code>&lt;div id="newdiv" data-bind="visible: selectedSection() === 'ulClass', stopBinding: true "&gt;
      &lt;ul id="ulClass" data-bind="template: { name: 'templatesSample', foreach: items}"&gt;
          &lt;script id="templatesSample" type="text/html"&gt;
              &lt;li&gt;&lt;span data - bind = "text:name" &gt; &lt;/span&gt;
              &lt;/li&gt;
          &lt;/script&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The view model</p>
  
  <pre><code>function names(firstnames) {
      this.name = ko.observable(firstnames);
  }
  
  var mappedData;
  var viewmodel;
  
  $(document).ready(function () {
      ko.bindingHandlers.stopBinding = {
          init: function () {
              return {
                  controlsDescendantBindings: true
              };
          }
      };
      ko.virtualElements.allowedBindings.stopBinding = true;
  
      viewmodel = function () {
          items: ko.observableArray([]);
      };
  
  
      var namesOfPeople = '[{"Firstnames":"john"},{"Firstnames":"peter"},{"Firstnames":"mary"}]';
      var dataFromServer = ko.utils.parseJson(namesOfPeople);
      mappedData = ko.utils.arrayMap(dataFromServer, function (item) {
          return new names(item.Firstnames);
      });
  
      viewmodel.items(mappedData);
  
      ko.applyBindings(viewmodel, document.getElementById("ulClass"));
  });
  </code></pre>
  
  <p>It shows following error in the console:</p>
  
  <pre><code>Uncaught TypeError: Object function ()
      {
           items:ko.observableArray([]);
  
      } has no method 'items' 
  </code></pre>
  
  <p>How can I fix the problem?Please suggest a solution.</p>
  
  <p>Thanks</p>