0

私はMeteor にcast.jsを実装しており、Iron Router を使用してサムネイルをクリックした後に大きな写真をレンダリングしようとしていますが、正しいパスのレンダリングに問題があります。サムネイルは問題なく表示されますが、写真をクリックするとエラーが発生しますNo route found for path:。

各サムネイル写真をレンダリングするために使用しているテンプレートは

  var renderTemplate = function(obj){
   return "<a href='{{pathFor photo}}'><img class='img-rounded' src='" + obj.picture + "'></a>"
  };

  Template.userPhotos.rendered = function(){
    var el = this.find('#cast');
    var mycast = cast(el);
    mycast.draw(renderTemplate);

    this.handle = Meteor.autorun(function(){
      var picture = Photos.find().fetch();
      mycast
        .data(picture , '_id')
        .dynamic(150, 150, 10, 10);
    });
  }

そしてcast、このテンプレートの id内に配置されます

<template name="userPhotos">
  <div class="container">
    <div class="photos">
      <div id='cast'></div>
    </div>
  </div>
</template>

問題は、レンダリングされる href から発生しています。_id写真を渡して、mongoDB で「ソース」と呼ばれる以下のテンプレートでより大きな写真をレンダリングしようとしています。

<template name="photo">
  <div class="well">
    <img class="img-rounded" src="{{source}}">
  </div>
</template>

現在、ルーターは次のように設定されています。

this.route('photo', {
    path: '/photo/:_id', 
    waitOn: function() {
      return [
        Meteor.subscribe('picture', this.params._id),
      ];
    },
    data: function() { return Photos.findOne(this.params._id); }
  });

写真をクリックすると、このパスに送られ、このエラーがスローされますOh no! No route found for path: "/%7B%7BpathFor"。%7B は URL{を表すため、テンプレートが文字列として渡されるときに、ハンドルバーまたは Iron Router がテンプレートを変換していないように見えます。

このコードを改善する方法について何か考えはありますか?

前もって感謝します！

4

1 に答える 1

0

関数renderTemplateは、レンダリングされたテンプレートではなく、文字列を返すだけです。そこで組み立てようとしていたテンプレートを、ヘルパーを使用して Handlebars テンプレートとして書き直します。

<template name="photoLink">
  <a href="{{getPathForPhoto}}">
    <img class="img-rounded" src="{{getThumbnailSrc}}">
  </a>
</template>

および（コンテキスト内の変数がプロパティとして持っているものがわからないため、以下を調整する必要がありthisます。基本的に、パス（または_idなどのパスのコンポーネント）とサムネイルパス/ srcを取得しますこの関数thisまたは渡されたパラメーターを介して):

Template.photoLink.getPathForPhoto = function() {
  return "/photo/" + this._id;
}

Template.photoLink.getThumbnailSrc = function() {
  return "/thumbnail/" + this._id;
}

繰り返しになりますが、上記の関数をアプリで機能させるには、これらの関数を作り直す必要があります。また、サムネイル パスのルートも作成する必要があります。

Handlebars でほんの少しのロジックを必要とする小さなことごとに小さな JavaScript 関数を作成するのは面倒ですか? はい。しかし、それはそれが設計されている方法です、申し訳ありません。他の関数を使用して、組み立てた文字列からテンプレートをレンダリングすることもできますが、この機能は Meteor の次のバージョンで廃止されます。

于 2014-01-09T23:58:28.920 に答える