Bagaimana cara mengubah layoutTemplate tergantung pada beberapa ekspresi? Router besi

Aplikasi saya memiliki banyak tata letak untuk kebutuhan berbeda, dan saya ingin memilihnya secara dinamis. Misalnya bergantung pada parameter GET, atau jika pengguna login.

Bagaimana saya bisa melakukan ini?


person Vitalii Del Vorobioff    schedule 26.02.2014    source sumber
comment
Secara pribadi, saya akan memindahkan sedikit logika ini ke template (menggunakan {{#if cond}} ... {{else}} ... {{/if}} dan mengomunikasikan kondisi menggunakan data yang tersedia di iron-router. Apakah ada alasan, selain menjaga templat sepenuhnya tanpa logika, bahwa Anda tidak mengambil pendekatan ini?   -  person musically_ut    schedule 26.02.2014
comment
Apakah Anda sudah menggunakan Iron Router atau paket router lainnya?   -  person Serkan Durusoy    schedule 26.02.2014
comment
Berdasarkan masalah ini, sepertinya konfigurasi layoutTemplate secara dinamis saat ini tidak bekerja. Saya mencoba beberapa permutasi dengan menetapkan templat secara kondisional di kait before di Router.configure dan di rute tertentu. Tak satu pun dari eksperimen tersebut berhasil.   -  person David Weldon    schedule 27.02.2014


Jawaban (4)


Anda sebenarnya dapat mengubah layoutTemplate secara dinamis menggunakan this.router.layout() dari dalam hook sebelumnya (dan mungkin hook lainnya). Ini agak tersembunyi, dan kemungkinan akan berubah tetapi inilah cara saya mengubah layoutTemplate tergantung pada apakah pengguna masuk atau tidak:

Router.configure({
    layoutTemplate: "defaultLayout",
    before: function (pause) {
        if(!Meteor.user()) {
            // render the login template but keep the url in the browser the same
            this.router.layout("loginLayout");
            this.render('login');

            // pause the rest of the before hooks and the action function
            pause();
        }else{
            //Here we have to change the layoutTemplate back to the default
            this.router.layout("defaultLayout");
        }
    }
});

Ini mungkin menjadi sedikit rumit jika Anda memiliki beberapa layoutTemplate karena setelah rute tidak lagi dijeda, rute tersebut akan mempertahankan layoutTemplate baru yang telah Anda tetapkan kecuali Anda mengubahnya lagi.

person Dsyko    schedule 18.04.2014
comment
Sekadar catatan untuk pelanggan; baru-baru ini, iron:router telah menggantikan pause() dengan this.next(), jadi kode ini tidak akan berfungsi tanpa modifikasi: stackoverflow.com/questions/26629835/ - person James M. Lay; 22.02.2015

EDIT Karena penulis mengedit pertanyaan di sini, dan spesifikasi iron:router telah berubah seiring waktu, saya memutuskan untuk menyegarkan jawaban ini sedikit untuk mencegah kebingungan.

Dokumentasi penggunaan paket iron:router dapat ditemukan di sini.

Ada beberapa kemungkinan jawaban atas pertanyaan tersebut tergantung pada jenis "parameter" apa.

Biasanya sumber pengetahuan utama adalah path, karena pengguna tidak serta merta mengharapkan perubahan tata letak halaman jika path tetap sama. Dalam hal ini masalahnya cukup sederhana, karena satu-satunya hal yang Anda perlukan adalah menentukan rute yang sesuai:

Router.route('/some/path/', {
  layoutTemplate: 'myFirstLayoutTemplate'
});

Router.route('/another/path/', {
  layoutTemplate: 'mySecondLayoutTemplate'
});

Jika Anda memerlukan kontrol yang lebih halus, Anda selalu dapat memilih tata letak secara manual di kait action yang ditetapkan ke rute pemberian:

Router.route('/some/path', {
  /* ... */
  action: function () {
    if (Meteor.user()) { // check if user is logged in
      this.layout('loggedInUserLayout');
    } else {
      this.layout('someDefaultLayout');
    }
    // you need this because otherwise the router
    // will not render your templates
    this.render();
  }
});

Harap dicatat bahwa kait action dijalankan dalam perhitungan dan karena Meteor.user() adalah sumber data reaktif halaman Anda akan dirender ulang setiap kali pengguna log-in/log-out.

Detail selengkapnya tentang tata letak dapat ditemukan di sini.

person Tomasz Lenarcik    schedule 26.02.2014
comment
Terima kasih! Bagi mereka yang ingin menghindari penggunaan this, ini juga berfungsi: Router.current().layout('loggedInUserLayout'). Bermanfaat bagi mereka yang menggunakan fungsi panah misalnya. - person Bart S; 25.05.2021

Meteor saat ini tidak memiliki kemampuan untuk merender template secara dinamis di server sebelum menyajikannya ke klien. Sebaliknya, ia menyajikan keseluruhan paket lengkap secara bersamaan.

Jadi dalam bundel itu, Anda membuat templat dan menggunakannya bergantung pada tindakan pengguna, jalur url, parameter sesi, dll.

Lihatlah Iron Router yang akan membantu Anda memulai.

Ada juga diskusi yang sedang berlangsung di grup Google meteor-talk dan item di papan trello peta jalan meteor.

person Serkan Durusoy    schedule 26.02.2014

Saya akan meninggalkan ini di sini saja, ini dari tahun 2019 dan berfungsi setelah beberapa kesulitan...

Router.route('/', function () {

    Router.current().layout("applicationLayoutEmpty");
    this.render('landing', {to: 'content'});

    if(Meteor.userId()){
        Router.go("/social");
    }

});

Keajaibannya ada di: Router.current().layout("applicationLayoutEmpty");

Ia menggunakan set default di main.js saat Anda mengonfigurasi IronRouter, namun ini dapat digunakan bahkan di jendela browser Anda -- cobalah!

person Andy    schedule 02.03.2019