tko
tko copied to clipboard
new keyword in foreach binding throws error
I have a foreach binding that builds an array using the page count so I can enumerate using the new array. tko throws an error on the new keyword.
<script src="https://cdn.jsdelivr.net/npm/@tko/[email protected]/dist/build.reference.min.js"></script>
..
..
..
<span data-bind="foreach: new Array(eventPageCount())">
<a class="pageLink"
data-bind="css: $parent.eventPageClass($index()),
text: $index,
click: $root.clickEventPage.bind($root, $index(), $parent)">
</a>
</span>
Error
bind.js:138 Uncaught Error: Unable to process binding "foreach" in binding "foreach"
Message: The variable "new" was not found on $data, $context, or globals.
at Rt.lookup (bind.js:138)
at e.get_value (utils.parser.js:377)
at e.get_leaf_value (utils.parser.js:180)
at e.get_value (utils.parser.js:199)
at e.get_value (utils.parser.js:278)
at Function.e.value_of (utils.parser.js:222)
at utils.parser.js:1171
at t.valueAccessor (bind.js:807)
at t.get [as value] (bind.js:329)
at new t (binding.foreach.js:116)
lookup @ bind.js:138
e.get_value @ utils.parser.js:377
e.get_leaf_value @ utils.parser.js:180
e.get_value @ utils.parser.js:199
e.get_value @ utils.parser.js:278
e.value_of @ utils.parser.js:222
(anonymous) @ utils.parser.js:1171
valueAccessor @ bind.js:807
get @ bind.js:329
t @ binding.foreach.js:116
(anonymous) @ bind.js:797
ze @ observable.js:125
f @ bind.js:796
on @ bind.js:836
tn @ bind.js:616
Zt @ bind.js:597
tn @ bind.js:625
Zt @ bind.js:597
tn @ bind.js:625
Zt @ bind.js:597
tn @ bind.js:625
Zt @ bind.js:597
ln @ bind.js:898
t.added @ binding.foreach.js:334
(anonymous) @ binding.foreach.js:238
o @ utils.js:52
t.processQueue @ binding.foreach.js:234
(anonymous) @ binding.foreach.js:212
requestAnimationFrame (async)
t.onArrayChange @ binding.foreach.js:212
la.notifySubscribers @ observable.js:331
e.notifySubscribers @ observable.js:603
(anonymous) @ observable.js:622
la.notifySubscribers @ observable.js:331
e.notifySubscribers @ observable.js:603
valueHasMutated @ observable.js:449
pt.fn.(anonymous function) @ observable.js:811
(anonymous) @ pageLive-1554523935.3255415.js:294
init @ pageLive-1554523935.3255415.js:289
async function (async)
init @ pageLive-1554523935.3255415.js:284
(anonymous) @ pageLive-1554523935.3255415.js:311
Move the new to the viewmodel. Currently you create part of the viewmodel in the view.
I moved the new to the viewmodel as a computed. The bind parser on tko is not as flexible as legacy knockout.
Perhaps you would prefer to use the repeat binding: https://github.com/mbest/knockout-repeat
Sounds like a worthy addition to tko.