check condition in foreach loop with dynamic variable in knockout js

Question

I have html file at the path /var/www/html/nelson-avnet-app/code/vendor/module/view/frontend/web/template/shipping-address/list.html

<!-- ko if: (visible)-->
<div class="field addresses">
 <div class="control">
 <input id="query" type="text" name="query" data-bind="textInput: query, valueUpdate: 'afterkeydown', event: { keyup: check }"/>
 <div class="shipping-address-items">
 <input type="text" data-bind="value: customTotal" />
 <!-- ko foreach: { data: elems, as: 'element' } -->
 <!-- ko if: element.index < customTotal -->
 <h1>show value</h1>
 <!-- /ko -->
 <!-- ko template: element.getTemplate() --><!-- /ko -->
 <!-- /ko -->
 </div>
 </div>
</div>
<!-- /ko -->

if I use if statement as <!-- ko if: element.index < 2 --> Then it works fine but it not work with dynamic value like

<!-- ko if: element.index < customTotal -->

Please help me.

Answer 1

Do you have customTotal in below js file if not You need to add customTotal variable in js file

vendor/magento/module-checkout/view/frontend/web/js/view/shipping-address/list.js
defaults: {
 template: 'Magento_Checkout/shipping-address/list',
 visible: addressList().length > 0,
 rendererTemplates: [],
 customTotal: 2
 },

You can extend/override this file on your custom module

• divyang asodiya: I already have customTotal as listed the code below, and its value is 3. But I can not apply condition on html page based on it. defaults: { template: 'Magento_Checkout/shipping-address/list', visible: addressList().length > 0, rendererTemplates: [], customTotal: ko.observable(0), },