javascript - Windows App Development - ListView retrieving data -


i new windows app development , trying create listview in order understand how works. problem trying use namespace on listview div , returns error saying property datasource doesn't exist.

this html , javascript:

    // introduction page control template, see following documentation:      // http://go.microsoft.com/fwlink/?linkid=232511      (function () {          "use strict";            winjs.ui.pages.define("/pages/episodes/episodes.html", {              // function called whenever user navigates page.              // populates page elements app's data.              ready: function (element, options) {                  // todo: initialize page here.                  episodes.data.assignitems(items);                  winjs.ui.processall();              },                unload: function () {                  // todo: respond navigations away page.              },                updatelayout: function (element) {                  /// <param name="element" domelement="true" />                    // todo: respond changes in layout.              },            });            winjs.namespace.define("episodes.data", {              itemsbindinglist: undefined,                assignitems: function (items) {                  episodes.data.itemsbindinglist = new winjs.binding.list(items);              },          });            var items = [              { title: 'air gear' },              { title: 'bakuman' }          ];        })();
    <!doctype html>      <html>      <head>          <meta charset="utf-8" />          <title>episodes</title>            <link href="episodes.css" rel="stylesheet" />          <script src="episodes.js"></script>      </head>      <body>          <div class="episodes fragment">              <header class="page-header" aria-label="header content" role="banner">                  <button class="back-button" data-win-control="winjs.ui.backbutton"></button>                  <h1 class="titlearea win-type-ellipsis">                      <span class="pagetitle">welcome episodes</span>                  </h1>              </header>              <section class="page-section" aria-label="main content" role="main">                  <div data-win-control="winjs.ui.listview" data-win-options="{                       itemdatasource : episodes.data.itemsbindinglist.datasource                       }"></div>              </section>          </div>      </body>      </html>

from can tell fact property undefined:

winjs.namespace.define("episodes.data", {             itemsbindinglist: undefined, //this problem              assignitems: function (items) {                 episodes.data.itemsbindinglist = new winjs.binding.list(items);             },         }); 

your html trying bind property of undefined object:

<section class="page-section" aria-label="main content" role="main">                 <div data-win-control="winjs.ui.listview" data-win-options="{                      itemdatasource : episodes.data.itemsbindinglist.datasource                      }"></div>             </section> 

either try using empty array initialize:

winjs.namespace.define("episodes.data", {             itemsbindinglist: new winjs.binding.list([]),              assignitems: function (items) {                 episodes.data.itemsbindinglist = new winjs.binding.list(items);             },         }); 

or can set datasource in code:

ready: function (element, options) {                 // todo: initialize page here.                 var listview = document.getelementbyid('mylistview').wincontrol;                 episodes.data.assignitems(items);                 listview.data = episodes.data.itemsbindinglist;                 winjs.ui.processall();             }, 

you can verify debugging in ready function , exception should come before breakpoint gets hit.


Comments