I wanted to bind the nested array to a list view but got the following exception. However, if I just bind a normal array to it, it works. Does it mean i cannot bind nested array? Any help would be appreciated.
When i tried to run this application, an exception was thrown:
Exception was thrown at line 6687, column 17 in ms-appx://microsoft.winjs.0.6.debug-8wekyb3d8bbwe/js/base.js
0x800a01b6 - JavaScript runtime error: Object doesn't support property or method 'bind'
File: base.js, line: 6687 column: 17
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Application9</title>
<!-- WinJS references -->
<link href="//Microsoft.WinJS.0.6/css/ui-dark.css" rel="stylesheet">
<script src="//Microsoft.WinJS.0.6/js/base.js"></script>
<script src="//Microsoft.WinJS.0.6/js/ui.js"></script>
<!-- Application9 references -->
<link href="/css/default.css" rel="stylesheet">
<script src="/js/default.js"></script>
</head>
<body>
<div id="myTemplate" data-win-control="WinJS.Binding.Template">
<span data-win-bind="innerText: text"></span>
<p></p>
<span data-win-bind="innerText: data[0].key"></span><span data-win-bind="innerText: data[0].value"></span>
<p></p>
<span data-win-bind="innerText: data[1].key"></span><span data-win-bind="innerText: data[1].value"></span>
</div>
<div id="basicListView" data-win-control="WinJS.UI.ListView"
data-win-options="{ itemDataSource : SmapleData.itemList.dataSource , itemTemplate: select('#myTemplate')}">
</div>
</body>
</html>
// For an introduction to the Blank template, see the following documentation:
// http://go.microsoft.com/fwlink/?LinkId=232509
(function () {
"use strict";
var app = WinJS.Application;
app.onactivated = function (eventObject) {
if (eventObject.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) {
if (eventObject.detail.previousExecutionState !== Windows.ApplicationModel.Activation.ApplicationExecutionState.terminated) {
// TODO: This application has been newly launched. Initialize
// your application here.
init();
} else {
// TODO: This application has been reactivated from suspension.
// Restore application state here.
}
WinJS.UI.processAll();
}
};
function init() {
var dataArray = [
{ text: "test1", data:[{key: "key1", value: "value1"},{key: "key2", value: "value2"}] },
{ text: "test2", data: [{ key: "key3", value: "value3" }, { key: "key4", value: "value4" }] }
];
var dataList = new WinJS.Binding.List(dataArray);
var publicMembers =
{
itemList: dataList
};
WinJS.Namespace.define("SmapleData", publicMembers);
}
app.oncheckpoint = function (eventObject) {
// TODO: This application is about to be suspended. Save any state
// that needs to persist across suspensions here. You might use the
// WinJS.Application.sessionState object, which is automatically
// saved and restored across suspension. If you need to complete an
// asynchronous operation before your application is suspended, call
// eventObject.setPromise().
};
app.start();
})();
