Render ulang template Blaze pada perubahan teks

Saya memiliki Templat Meteor Blaze berdasarkan autoform.

<template name="patientForm">

<div class='mdl-cell mdl-cell--12-col'>
    {{#autoForm id="insertUpdatePatientForm" collection="Patients" doc=selectedPatientDoc
    type=formType validation="browser" template="semanticUI"}}
    <div class='two fields'>
    {{> afQuickField name="firstName"}}
    {{> afQuickField name="lastName"}}
    </div>
    <div class='two fields'>
   {{> afQuickField name="phn.type"}}
   {{> afQuickField name="phn.value" class="ramq"}}
   </div>
       <div class='two fields'>
        {{> afQuickField name="birthDate"}}
        {{> afQuickField name="gender"}}
       </div>

    <button class="ui submit button" type="submit">Save</button>
    <div class="ui error message"></div>
    {{/autoForm}}
</div>
</template>

Saya ingin menangani acara perubahan teks untuk input dengan nama phn.value. Berdasarkan teks tersebut, saya ingin mengisi dua bidang lainnya secara otomatis: jenis kelamin dan tanggal lahir. Saya melakukannya dengan mengubah data template secara langsung sebagai berikut:

Template.patientForm.events({
    'change .ramq': function changeRAMQ(event, templateInstance) {
        const { patient } = templateInstance.data;
        if (patient.phn.type === 'RAMQ') {
            const ramq = event.target.value;
            const yy = parseInt(ramq.substr(4, 2), 10);
            let mm = parseInt(ramq.substr(6, 2), 10);
            const dd = parseInt(ramq.substr(8, 2), 10);
            patient.gender = mm < 13 ? 'Male' : 'Female';
            if (mm > 50) {
                mm -= 50;
            }
            patient.birthDate = moment(new Date(yy, mm, dd)).format('YYYY-MM-DD');
        }
    },
});

Saya mendapatkan data templat dan langsung mengubah jenis kelamin dan tanggal lahir ketika nilai phn.value berubah. Namun, jenis kelamin dan tanggal lahir yang diubah tidak dirender ulang di template autoform/blaze. Adakah cara yang dapat saya gunakan untuk memaksa rendering ulang template Blaze atau cara alternatif untuk melakukan perubahan pada kontrol lain di template Blaze?


meteor meteor-blaze meteor-autoform
person vijayst    schedule 31.10.2016    source sumber

Jawaban (2)


arrow_upward
1
arrow_downward

Untuk mengaktifkan reaktivitas dan rendering ulang bidang, Anda harus menggunakan ReactiveVar (atau ReactiveDict)

Anda dapat melakukannya seperti ini:

Template.patientForm.onCreated(function(){
  const instance = this;
  instance.birthDate = new ReactiveVar()
});

Dan di pembantu dan acara Anda, Anda dapat menggunakan instance.birthDate.set() / get()

Template.patientForm.helpers({
   birthDate() {
      return Template.instance().birthDate.get()
   }
});

Template.patientForm.events({
   'click something'(event, instance){
   ....
     instance.birthDate.set(value);
   ....
   }
});
person Xander    schedule 01.11.2016

arrow_upward
2
arrow_downward

Anda tidak dapat mengubah data templat secara langsung (bisa, tetapi itu tidak reaktif dan akan ditimpa). Dari mana Anda mendapatkan data template? Koleksi? variabel reaktif? Jika ya, ubah data di sana -- Blaze akan melihat perubahannya dan merender ulang.

Seharusnya hal seperti ini akan berhasil:

Patients.update(templateInstance.data._id, {$set: {
  birthDate: ..,
  gender: .. 
}});
person Christian Fritz    schedule 31.10.2016
comment
Ini adalah formulir addPatient. Saya ingin mengisi dua bidang lainnya secara otomatis berdasarkan nilai kotak teks. - person vijayst; 31.10.2016