5

Meteors テンプレートの動作を理解するのを手伝ってくれませんか?

Apples Growl に似た、プロジェクトに通知システムを実装したいと思います。レコードがデータベースに書き込まれるときに、単純な jQuery 効果を使用してメッセージを表示します。本質的な問題を示すために、コード例を単純化しました。

コード：

var Messages = new Meteor.Collection("messages");

if (Meteor.isClient) {
   Template.Notification.Message = function() {
     return Message.findOne({}, {sort: {seq: -1}});
   };

   Template.Notification.rendered = function() {
    $("#livebar").fadeIn(400).delay(1000).fadeOut(400);
   }
}

テンプレート:

<template name="Notification">
<div class="row">
   <div class="span6 alert alert-error" id="livebar" style="display:none;">
        {{Messages.text}}
   </div>
</div>
</template>

ページがレンダリングされると、空の非表示領域が jQuery 効果でレンダリングされ、その後、システムはリアクティブ データソース (メッセージ) をロードし、領域を再度レンダリングします! 2 回レンダリングされないようにしましたが、成功しませんでした。エラーは簡単に修正できるようですが、ここで立ち往生しています。助けていただければ幸いです！

4

2 に答える 2

3

次の追加コードが必要です。

まずmeteor remove autopublish、プロジェクト内のターミナルで実行します。

次に、何を公開するかを定義します

//On isServer
Meteor.publish('messages', function(){
    return Messages.find();
});

次に、そのデータを購読し、準備が整うまで待ちます

//On isClient
subscription_handle = Meteor.subscribe('messages');

Meteor.autorun( function(computation) {
    if( subscription_handle.ready() ) {

        //The data is now ready, start your templates here

        computation.stop(); //Stop autorun
    } 
});

また、コレクションをvar Messages = new Meteor.Collection("messages");として定義して、グローバル変数にします。

まったく異なる (しかし簡単な) アプローチは、Iron Router のテンプレート ルートのwaitOnプロパティを使用することです。これにより、データの準備が整った後にテンプレートがレンダリングされます。

于 2014-03-25T07:46:28.813 に答える
3

{{> Notification}}テンプレート呼び出しを{{#if}}ブロックで囲むことができます。

{{#if has_notifications}}
  {{> Notifications}}
{{/if}}

//JS
Template.foo.has_notifications = function() {
  Message.find().count() > 0;
}

ただし、データが 1 つの部分ではないため、テンプレートが複数回レンダリングされる可能性があります。タイムアウトはそこであなたを助けることができます...

于 2012-11-12T11:12:48.060 に答える