Template7 if array.length

it would seem to me that this should work:

{{#if myarray.length}}
If my array has items in it we show this block. It would likely be the container for the list items we loop through.
{{/if}}

but it appears not.
neither does:

{{#js_if “…/view_data.actions.length”}}

How do we check if an array has length with template7?

go to https://framework7.io/kitchen-sink/core/
open console:

var tmpl='{{#if arr.length}}ok{{else}}empty{{/if}}';
console.log(Template7.compile(tmpl)({arr:[]}));      // => empty
console.log(Template7.compile(tmpl)({arr:[1,2,3]})); // => ok

Yes, this is correct method to check and should work, unless there is no myarray property in template context

{{#js_if “…/view_data.actions.length”}} in js_if we can’t get access to parent.

var tmpl=’{{#if arr.length}}ok{{else}}empty{{/if}}’; return undefined for me.

Probably you array is not a real array, but an object without length. You can try:

Object.keys(arr).length

I did this

{{#if Object.keys(histories).length == 0 }}
						<div class="row resizable">
							<div class="col-100">
								<h5 class="text-size-15 text-center josefin-sans-bold-font grey-text-color">My history yet</h5>
							</div>
						</div>
					{{else}} ... {{/if}}

It returned this

SyntaxError: missing name after . operator

Then i did this

{{#if Object.keys(histories).length }}

It returned

Error: TypeError: ctx_1.Object is undefined

You might have to put them into js_if:

{{#js_if "Object.keys(histories).length == 0"}}
   ... your markup ...
{{/js_if}}

Error: ReferenceError: histories is not defined

In Javascript blocks, you have to use this prefix depending on your context:

{{#js_if "Object.keys(this.histories).length == 0"}}
   ... your markup ...
{{/js_if}}

{{#js_if "Object.keys(this.histories).length == 0" }}

<script>
    return {
    	mounted(){
    		const self = this;
    		const app = self.$f7;

            // var $$ = self.$Dom7;

            // self.$ or self.$$ or self.$dom7 (Working code...)

            let dataURL = 'https://m.briskmail.co/api/v1/histories';

            this.$f7.request.get(dataURL, function (data) {

            	d_data = data; // JSON.parse(data);

            	self.histories = d_data.histories;
            	console.log(d_data.histories);
            });
        },
        data () {
        	return {
        		title: 'Histories',
        		histories: []
        	};
        }
    };
</script>

console.log(d_data.histories);

Returns undefined.

Do a console dump of data. Doesn’t look like histories exists (or is accessible where you expect it to be)

SERVER RESPONSE
{“histories”:[{“id”:1,“user_id”:“5”,“from”:“Amuwo”,“to”:“Festac”,“price”:“3500”,“delivery_date”:“20399232”,“status”:“delivered”,“created_at”:null,“updated_at”:null}]}

CONSOLE DUMP console.log(d_data);
{“histories”:[{“id”:1,“user_id”:“5”,“from”:“Amuwo”,“to”:“Festac”,“price”:“3500”,“delivery_date”:“20399232”,“status”:“delivered”,“created_at”:null,“updated_at”:null}]}