Как получить изображение в Jade из коллекции Meteor FS - PullRequest
0 голосов
/ 29 марта 2020

Я работаю над существующим проектом Метеор. У меня есть схема, как показано ниже,

Activities.schema = new SimpleSchema({
  title: {
    type: String,
    label: 'Title',
    index: 1,
  },

export const ActivitiesImages = new FS.Collection('activitiesImages', {
  stores: [
    new FS.Store.GridFS('homeActivitiesImages', { transformWrite: homeActivityImage }),
    new FS.Store.GridFS('origActivitiesImages', {}),
  ],
  filter: {
    maxSize: 1024 * 1024 * 5,
    allow: {
      contentTypes: ['image/*'],
    },
  },
});
.........
)}

И я нашел код вставки, как показано ниже

 const insertObj = {
        title,
        description,
        type: [type],
        divisions: [],
        clubType,
        createdBy,
        privateType,
      };

      if (image) {
        insertObj.image = ActivitiesImages.insert(image);
      }

      Meteor.call('v1/insertActivity', insertObj, (error) => {
        if (error) {
          sAlert.error(error.message);
        } else {
          sAlert.success('Activity added');
          $('.activity-modal').modal('hide');
        }
      });

Теперь мое требование заключается в том, что я хотел отобразить сохраненное изображение выше в приведенном ниже Jade Шаблон. Я нахожу трудности в рендеринге того же самого.

MyProfile.tpl.jade (Шаблон Jade)

 each activity in fiveStarActivities
                          .slider__item
                            .ui.segment
                                .ui.vertical.segment
                                    h3.ui.header.center.aligned {{activity.title}}
                                    .ui.list
                                        .item
                                            img(
                                                src="{{HERE I WANT TO DISPLAY IMAGE}}"
                                                alt="image description"
                                            ).ui.fluid.rounded.image
                                        .item     
                                            .ui.vertical.segment.big-card__btn-src
                                                button.ui.mini.grey.basic.button {{activity.title}}
                                        .item    
                                            p {{activity.description}}

Я пробовал ниже, но не работал. MyProfile. js

    activityImage(activity) {
        return ActivitiesImages.findOne({ _id: activity.image._id });
    },

Может кто-нибудь помочь мне с отображением изображения на шаблоне Jade?

1 Ответ

0 голосов
/ 06 апреля 2020

Я решил эту проблему, изменив шаблон, как показано ниже.

MyProfile.tpl.jade

each activity in fiveStarActivities
      .slider__item
        .ui.segment
            .ui.vertical.segment
                h3.ui.header.center.aligned {{activity.title}}
                .ui.list
                    if activityImage activity
                      with activityImage activity
                        .item
                            img(
                                src="{{this.url store='homeActivitiesImages'}}"
                                alt="image description"
                            ).ui.fluid.rounded.image.medium

MyProfile. js

ActivitiesImages.findOne({ _id: activity.image._id });
...