handlerbars.js periksa apakah daftar kosong

122

Apakah ada cara di Handlebars.js membuat template untuk memeriksa apakah koleksi atau daftar kosong atau kosong, sebelum pergi dan mengulang melalui daftar / koleksi?

// if list is empty do some rendering ... otherwise do the normal
{{#list items}}

{{/list}}



{{#each items}}

{{/each}}

handlebars.js

— Drejc
sumber

209

Tag "setiap" juga dapat mengambil bagian "lain". Jadi bentuk yang paling sederhana adalah:

{{#each items}}
// render item
{{else}}
// render empty
{{/each}}

— Emre Efendi
sumber

1

Itu keren, tapi tidak menjawab pertanyaannya. Jika Anda ingin sebuah tag membungkus #each, seperti sebuah <ul>tag (dengan <li>s di dalamnya), Anda tidak ingin keadaan kosong dibungkus oleh <ul>.

— Leonardo Raele

236

Jika Anda memiliki sesuatu yang ingin Anda tampilkan sekali dan hanya jika array memiliki data , gunakan

{{#if items.length}}
    //Render
{{/if}}

.length akan mengembalikan 0 untuk larik kosong sehingga kita telah mencapai nilai palsu yang sebenarnya.

— Duane
sumber

1

Kedua jawaban itu benar dan berhasil, dan mereka menjawab pertanyaan itu. Begitulah cara menampilkan sesuatu ketika tidak ada data dalam array. Bukan sebaliknya.

— Drejc

15

Tidak, saya setuju, ini adalah jawaban yang benar. Ini tidak termasuk loop for.

— radtek

4

Kasus sederhana: Saya ingin membuat <ul>tag sekali dan <li>tag untuk setiap item dalam daftar. Jika daftarnya kosong, saya bahkan tidak ingin <ul>merender, dan merender sesuatu yang lain seperti <p>empty list<p>di dalam <ul>tidak masuk akal.

— Fuad Saud

2

Jawaban ini khusus untuk implementasi. Dokumen setang menetapkan yang []dievaluasi sebagai salah. Jawaban oleh @Drejc adalah jawaban yang benar menurut spesifikasi stang.

— Stim

1

terima kasih bung itu adalah solusi yang jauh lebih baik daripada registerHelper.

— Denmark

38

Oke, ini lebih sederhana dari yang saya kira:

{{#if items}}
// render items

{{#each items}}
// render item
{{/each}}

{{else}}
// render empty
{{/if}}

— Drejc
sumber

5

Jika itemssebuah array kosong (yaitu memiliki nilai []), itu akan menghasilkan nilai yang benar. Sedangkan items.lengthmenghasilkan nilai falsey untuk larik kosong. Lihat jawaban @ Duane .

— gfullam

Huh ... 3 tahun telah berlalu sejak ... mungkin implementasinya telah berubah atau saya sederhana tidak memiliki kasus [] array. Sejauh yang saya ingat, itu berhasil untuk saya.

— Drejc

12

Kamu benar. Saya Terlebih Dahulu berkomentar berdasarkan perilaku asli JS' if, tapi dokumentasi Setang sangat jelas: 'Jika yang argumen kembali false, undefined, null, "", 0, atau [], Setang tidak akan membuat blok.' Seharusnya aku cek dokumennya dulu.

— gfullam

8

Jika Anda ingin memeriksa apakah sebuah koleksi (kursor) kosong atau tidak, jawaban sebelumnya tidak akan berguna, sebaliknya Anda harus menggunakan count()cara:

{{#if items.count}}
    <p>There is {{items.count}} item(s).</p>
{{else}}
    <p>There is nothing</p>
{{/if}}

— Karl.S
sumber

2

@BasicWolf tidak, count bekerja dengan kursor, jika Anda memiliki panjang penggunaan array.

— Karl.S

Ini berfungsi dengan baik untuk memeriksa antara array dan objek, dan menanganinya secara berbeda.

— Ryan Walton

2

Untuk siapa saja yang perlu menggunakan {{#each}} di atas {{#if}} (yaitu loop if di dalam loop for). Apakah mereka memiliki tiga daftar larik yang berbeda.

Menggunakan pencarian di dalam pernyataan if memecahkan masalah untuk saya. Karena, jawaban di atas tidak menyelesaikan masalah saya.

Ini kode saya,

{{#each OtherRandomItems}}

  {{this}}

  {{lookup ../AnotherRandomItems @index}}

  {{#if (lookup ../RandomItems @index)}}
  // render items
  {{else}}
  // render empty
  {{/if}}

{{/each}}

— Akarsh SEGGEMU
sumber