Run JS nach einem Meteor Vorlage

Question

Rendering Ich habe eine Vorlage, die etwa wie folgt aussieht:

<template name="foo"> 
    <textarea name="text">{{contents}}</textarea> 
</template> 

ich machen es mit:

Template.foo = function() { 
    return Foos.find(); 
} 

Und ich habe einige Event-Handler:

Template.foo.events = { 
    'blur textarea': blurHandler 
} 

Was ich tun möchte, ist das rows Attribut der textarea abhängig von der Größe des Inhalts. Mir ist klar, dass ich einen Handlebars-Helfer schreiben könnte, aber er hätte keinen Zugriff auf das gerenderte DOM-Element, was mich zu unnötigen Duplizierungen zwingt. Im Idealfall möchte ich, dass ein Meteor ein Ereignis auslöst, nachdem ein Element gerendert wurde. Etwas wie:

Template.foo.events = { 
    'render textarea': sizeTextarea 
} 

Ist das möglich?

Answer 1

Ich denke, der aktuelle "beste" Weg, dies zu tun (es ist ein bisschen ein Hack) ist zu verwenden Meteor.defer ala Callback after the DOM was updated in Meteor.js.

Geoff ist eine der Meteor Devs, so sein Wort Evangelium :) ist

Also in Ihrem Fall, Sie könnten so etwas wie tun:

<textarea id="{{attach_textarea}}">....</textarea> 

und

Template.foo.attach_textarea = function() { 
    if (!this.uuid) this.uuid = Meteor.uuid(); 

    Meteor.defer(function() { 
    $('#' + this.uuid).whatever(); 
    }); 

    return this.uuid; 
} 

EDIT

Beachten Sie, dass als 0.4.0 können Sie tun dies in einem viel Ad-hoc-Weise (wie von Sander wies darauf hin):

Template.foo.rendered = function() { 
    $(this.find('textarea')).whatever(); 
} 

Answer 2

Ja, ich denke schon - nicht sicher, ob es „der richtige Weg“, aber das funktioniert für mich:

In Ihrer App JS, der Client Abschnitt unabhängig von Javascript dort auf dem Client ausgeführt wird. Zum Beispiel:

if (Meteor.is_client) { 
    $(function() { 
     $('textarea').attr('rows' , 12) // or whatever you need to do 
    }) 
    ... 

Hinweis des Beispiel verwendet JQuery, in dem Fall, dass Sie diese an den Client zur Verfügung stellen müssen (ich :-) denken. In meinem Fall:

Ich erstellte ein/Client-Verzeichnis und fügte jquery.js-Datei unter diesem hinzu.

Hoffe, das hilft.

Answer 3

Ab Meteor 0.4.0 es möglich ist, zu überprüfen, ob eine Vorlage Rendering abgeschlossen ist, sehen http://docs.meteor.com/#template_rendered

Wenn ich verstehe, Ihre Frage richtig, sollten Sie Ihren Textbereich resize-Code innerhalb einer Template.foo.onRendered Funktion wickeln:

Template.foo.onRendered(function() { 
    this.attach_textarea(); 
}) 

Answer 4

Seit etwa 2014 Juni der richtige Weg, dies einen Rückruf mit Template.myTemplate.onRendered() eingestellt gewesen zu tun hat.