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.

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:


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>
					{{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 ...

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 "Object.keys(this.histories).length == 0" }}

    return {
    		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;
        data () {
        	return {
        		title: 'Histories',
        		histories: []


Returns undefined.

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


CONSOLE DUMP console.log(d_data);