Как передать данные параметров между шаблонами в потоке потока метеора потока

У меня есть шаблон под названием «Заказы», ​​который показывает коллекцию изображений моих заказов:

{{#each images}}
<div class="images">
  <a href="/order/{{this._id}}"> <img class="image" src="{{this.url  }}"  /></a>
</div>
{{/each}}

Нет, я хочу, чтобы другой шаблон под названием order показывал мне только один элемент из коллекции, на который я нажимаю: я пытаюсь сделать так: 1. события orders.js для клика по изображению:

"click .image": function() {
            Images.find({_id:this._id});

и заказы.html:

<a href="/order/{{this._id}}"> <img class="image" src="{{this.url  }}"  /></a>

У меня также есть route.js:

FlowRouter.route("/orders", {                 **this part works fine**
                    action: function(){
                    FlowLayout.render("layout",{top:"orders", main:"test"});
                    }

  FlowRouter.route('/order/', {             **How do I do this part ????????**
                    action: function(){
                    FlowLayout.render("layout",{top:"order",data:image});

                    }

Я использовал динамический шаблон макета, чтобы показать заказы, которые отображаются нормально. Как установить единый порядок html, маршрут и визуализацию????


person Siros Jarchlou    schedule 01.01.2016    source источник


Ответы (2)


Чтобы ответить на ваш вопрос:

Начиная с вашего маршрута, вы должны передать параметр id в пути следующим образом:

FlowRouter.route('/order/:imageId', {             
  action: function() {
    FlowLayout.render("layout",{ top: "order", main: "test" });
  }
});

Глядя на рендеринг в файле order.html, который содержит порядок шаблонов, что-то вроде:

<template name="order">
  {{#with image}}
    <!-- whatever you want to do -->
    <img src="{{url}}" />
  {{/with}}
</template>

В этом шаблоне используется order.js с подпиской на вашу коллекцию только для одного изображения и хелпер с именем image, который ищет параметр imageId, который вы передали в своем маршруте через функцию FlowRouter.getParam:

Template.order.onCreated(function() {
    var imageId = FlowRouter.getParam('imagedId');
    if ( imageId !== undefined ) {
      Meteor.subscribe('oneImage', imageId);
    }      
}

Template.order.helpers({
  image: function() {
    var imageId = FlowRouter.getParam('imagedId');
    if ( imageId !== undefined ) {
      return Images.findOne({ _id: imageId });
    }
  }
}

И в заключение, на стороне сервера, вы должны сделать публикацию:

Meteor.publish('oneImage', function(imageId) {
  return Images.findOne({ _id: imageId });
}

Следуя этому пути, вам больше не нужно ваше мероприятие click .image, и вы оптимизировали свою производительность! ;)

Кстати, на order.html в вашем цикле {{#each}} вам не нужно писать {{this.url}} или {{this._id}}, {{url}} и {{_id}} все в порядке ;)

person Xavier Cazalot    schedule 01.01.2016
comment
Спасибо, Ксавьер, я попробую это. - person Siros Jarchlou; 02.01.2016

Чтобы получить параметр запроса, вы можете использовать:

FlowRouter.current().route._params.keys.id
person daniel assayag    schedule 06.10.2020