2

次のようなテンプレートがあります。

<template name="foo">
  <div id="wrapper" style="overflow: hidden">
    <div id="content" style="margin-top: -{{contentHeight}}px">
      {{content}}
    </div>
    <button id="toggle">Show/Hide Content</button>
  </div>
</template>

where{{contentHeight}}は の高さを計算するヘルパーで#content、トグル ボタンをクリックすると#content、マージンがアニメーション化されて上下にスライドします。

問題は、 でデータベースの更新を行うとfoo、#contentの属性が新しい値でstyleリセットされ、非表示になることです。contentHeight一度レンダリングされた要素に Meteor が触れないようにしたいのですが、一意の ID を与えてもそれは妨げられません。ドキュメントが言うように：

Meteor は、囲んでいるテンプレートが再レンダリングされた場合でも [一意の名前/ID を持つ要素] を保持しますが、それでも子を更新し、属性の変更をコピーします。

（私のものを強調してください。）では、最善のアプローチは何ですか？styleテンプレートがレンダリングされるときに要素を設定し、Meteor が属性を変更できないようにするにはどうすればよいですか?

4

1 に答える 1

0

次のようなことを試しましたか：

<div id="content" {{contentHeightStyle}}>

Template.foo.contentHeightStyle = function() {
  if (!this._contentHeightStyleCalculated) {
    this._contentHeightStyleCalculated = true;
    return 'style="..."';
  }
}
于 2012-06-17T07:57:54.210 に答える