Hello,
I am newbie in OJET, I tried to use cookbook, to create application with navdraw Template, and I changed Customers page to implement right menu using navigationList, but I had error when I click on customers page
-------------------------------------------------------------------------------------------------------------------------
Uncaught (in promise) TypeError: Unable to process binding "_ojCustomElement: function () {
return { composite: info.composite };
}"
Message: Unable to process binding "_ojBindForEach_: function(){return {data:router.states} }"
Message: Cannot read property 'states' of undefined
at _ojBindForEach_ (eval at createBindingsStringEvaluator (knockout-3.4.2.debug.js:1), <anonymous>:3:88)
at ko.computed.disposeWhenNodeIsRemoved (ojknockout.js:3723)
at Function.evaluateImmediate_CallReadThenEndDependencyDetection (knockout-3.4.2.debug.js:2183)
at Function.evaluateImmediate_CallReadWithDependencyDetection (knockout-3.4.2.debug.js:2150)
at Function.evaluateImmediate (knockout-3.4.2.debug.js:2111)
at Object.ko.computed.ko.dependentObservable (knockout-3.4.2.debug.js:1964)
at init (ojknockout.js:3719)
at knockout-3.4.2.debug.js:3368
at Object.ignore (knockout-3.4.2.debug.js:1480)
at knockout-3.4.2.debug.js:3367
---------------------------------------------------------------------------------------------------------------------------
the JS of customers is blow:
/**
* @license
* Copyright (c) 2014, 2019, Oracle and/or its affiliates.
* The Universal Permissive License (UPL), Version 1.0
*/
/*
* Your customer ViewModel code goes here
*/
define([
'ojs/ojrouter',
'knockout',
'ojs/ojknockout', 'ojs/ojnavigationlist', 'ojs/ojinputtext', 'ojs/ojdialog'
], function(Router, ko) {
var chapters = {
'preface': 'Darn beamed hurriedly because banal more \
giraffe shuffled and well rid placidly where hence or and and hound lantern cutely \
instead inaudibly but demonstrable imitatively one regarding a where much fruitlessly \
more depending goodness less as dear shark directed this one.',
'chapter1': 'Affectingly and yikes one that along \
versus growled unwitting vulnerably fish far pouting otter some as this hamster \
hatchet where amicably far deftly curtsied.',
'chapter2': 'More up mistaken for a kissed therefore \
ahead thus on dear wow undertook flabbily less much far sourly impala resolutely and \
and as overheard dachshund this.',
'chapter3': 'Reindeer up while the far darn falcon \
concurrent iguana this strived unicorn hedgehog depending more lemming was swam \
unlike prosperously regarding shameful when and extravagant that then cat contagious.'
};
function isDirty() {
var value,
currentState = viewModel.router.currentState();
if (currentState) {
value = currentState.value;
}
return viewModel.data() !== value;
}
/**
* The view model for the book page.
*/
var viewModel = {
router : undefined ,
//router: Router.rootInstance,
active: false,
// Store temporary chapter content there
data: ko.observable(),
initialize: function(data) {
this.active = true;
if (this.router) {
return;
}
//router = Router.rootInstance;
var parentRouter = data.parentRouter;
this.router = parentRouter.createChildRouter('chapter')
.configure({
'preface': {
label: 'Preface',
value: chapters['preface'],
canExit: viewModel.canExitCB
},
'chapter1': {
label: 'Chapter 1',
value: chapters['chapter1'],
canExit: viewModel.canExitCB
},
'chapter2': {
label: 'Chapter 2',
value: chapters['chapter2'],
canExit: viewModel.canExitCB
},
'chapter3': {
label: 'Chapter 3',
value: chapters['chapter3'],
canExit: viewModel.canExitCB
}
});
// Push new value to data observable when router value changes.
this.subscription = this.router.currentState.subscribe(function(newState) {
viewModel.data(newState && newState.value);
});
// Now that the router for this view exist, synchronise it with the URL
Router.sync();
},
canExitCB: function() {
if (viewModel.active && isDirty()) {
// Make a confirm dialog promise
var promise = new Promise(function(resolve, reject) {
var okBtn = document.getElementById('dlgOkBtn');
var exitDialog = document.getElementById('exitDialog');
function clickHandler() {
resolve(true);
exitDialog.close();
}
okBtn.addEventListener('click', clickHandler);
exitDialog.addEventListener('ojClose', function(event) {
okBtn.removeEventListener('click', clickHandler);
// No-op if promise already resolved (like when 'OK' is clicked)
resolve(false);
});
exitDialog.open();
});
return promise;
}
return true;
},
save: function() {
if (isDirty()) {
// Assign the new value to the current state
viewModel.router.currentState().value = viewModel.data();
}
},
selectHandler: function(event) {
if ('menu' === event.target.id && event.detail.originalEvent) {
// router takes care of changing the selection
event.preventDefault();
// Invoke go() with the selected item.
viewModel.router.go(event.detail.key);
}
},
dispose: function() {
this.active = false;
this.subscription.dispose();
}
};
return viewModel;
});