I have a page using knockout 2.3.0 and nested templates that was working fine untill I updated it to version 3.2.0.
If I strip away the rest of the page, the structure that fails looks like this:
...
<!-- ko template: {name: 'meta-data-template', foreach: DocumentMetaDataList} -->
<!-- /ko -->
...
<script type="text/html" id="meta-data-template">
<label data-bind="text: FieldName() + ':', visible: $root.labelIsVisible($data)"></label>
<!-- ko template: { name: $root.displayAddFieldTemplate, data: $data } -->
<!-- /ko -->
</script>**
In this case, displayAddFieldTemplate
resolves to "meta-add-template"
that looks like this
<script type="text/html" id="meta-add-template">
<a class="add-fieldvalue" href="#" data-bind="visible: $root.fieldValueIsVisible($data)">Link</a>
</script>
I have hardcoded $root.fieldValueIsVisible($data)
to return true, so that the link should always be shown. This however, gives the following javascript error when I run it in the browser:
Uncaught TypeError: Unable to process binding "template: function (){return { name:$root.displayAddFieldTemplate,data:$data} }"
Message: undefined is not a function
If I remove the data-bind from the meta-add-template
, so that is looks like this it works as expected.
<script type="text/html" id="meta-add-template">
<a class="add-fieldvalue" href="#">Link</a>
</script>
Even if I inline a value into the data-bind
it gives the same error message. So it fails for this template as well:
<script type="text/html" id="meta-add-template">
<a class="add-fieldvalue" data-bind="visible:true" href="#">Link</a>
</script>
Why does this not work as expected, and why did it stop working after the update from 2.3 to 3.2?