Создание фильтра тегов для блога в handlebars / endurojs - PullRequest
Новая
       17

Создание фильтра тегов для блога в handlebars / endurojs

0 голосов
/ 25 октября 2018

Я создаю блог с тегами, каждая запись блога может иметь несколько тегов, которые можно отфильтровать, чтобы показать записи блога с одним и тем же выбранным тегом.

Моя проблема заключается в том, что при фильтрации результатов яЯ не уверен, как отправить тег (или ключевое слово) другому помощнику руля в качестве параметра, поэтому я могу отображать только записи блога с тем же тегом.

Этот код получает все теги из всех записей блога.: 

<h4 class="white-color remove-margin">Tags:
      {{#blog}}
          {{#joinTags this}}
             {{#each this}}
                  <a class="badge bg-light-blue" onclick="filterBlogEntries('{{this}}')">#{{this}}</a>
              {{/each}}
          {{/joinTags}}
      {{/blog}}
</h4>

filterBlogEntries сейчас ничего не делает, только печатает отправленный параметр.Именно этот параметр мне нужен для фильтрации всех записей в блоге.

Пока я перечисляю все записи в блоге следующим образом: 

 {{#blog}}
       {{#each_upto this 6}}
                            <article>
                                  <li class="blog-list__item">   
                                    <div class="blog-entry">
                                        <img class="blog-entry__img" src="{{blog_entry.blog_img}}">
                                        <h4 class="blog-tag">
                                            {{#each blog_entry.blog_tag}}
                                                <span class="badge bg-light-blue">#{{this}}</span>
                                            {{/each}}
                                        </h4>
                                        <h3 class="highlight center-text remove-margin">{{blog_entry.blog_title}}</h3>
                                        <h4 class="center-text remove-margin">{{blog_entry.blog_subtitle}}</h4>
                                        <a class="blue-color bold center-text" onclick="showEntry( '{{blog_entry.blog_img}}','{{blog_entry.blog_tag}}','{{blog_entry.blog_title}}',   '{{blog_entry.blog_subtitle}}','{{blog_entry.blog_text}}')">Ver más</a>
                                    </div>
                               </li>                  

                            </article>
       {{/each_upto}}
  {{/blog}}

Теперь мой вопрос заключается вФункция filterBlogEntries (), как я могу отправить выбранный пользователем тег для фильтрации записей в блоге по тегу?

1 Ответ

0 голосов
/ 12 января 2019

В последнее время у меня возникла похожая проблема: сначала я добавляю теги к сообщениям в блоге, а затем на страницу, где они будут перечислены, я также создал нового помощника для вывода списка сообщений по тегу.1003 * cms / generators / blog / example-post.js выглядит следующим образом 

({
    $meta_data_expander: true,
    $meta_data_info: 'won\'t work with the temp action',
    meta_data: {
        page_title: '',
        $keywords_type: 'textarea',
        keywords: '',
        $meta_description_type: 'textarea',
        meta_description: ''
    },
    display_title: 'Example title',
    published: true,
    $date_value: '2019-01-08',
    $date_type: 'date',
    date: 'Tuesday, 08 January, 2019',
    teaser: {
        $cover_type: 'image',
        cover: '/remote/direct_uploads/1546951493_lite-feature.jpg',
        marked: 'Example endurojs generator template.',
        $marked_markdown: false,
        $marked_type: 'textarea'
    },
    main_content: {
        $content_type: 'quill',
        content: '<h1>Heading 1</h1><h2>Heading 2</h2><h3>Heading 3</h3><p>Normal</p>',
        $content_control_path: '/brick/enduro_quill/quill_control'
    },
    enable_comments: true,
    $tags_templatitator: '@@global.tags_elements',
    tags: [
        {
            project: true
        }
    ]
})

Все теги добавляются в массивы тегов.

На странице, где статьибудут перечислены cms / projects.js мы определяем теги статьи, которые будут отображаться. 

({
    $meta_data_expander: true,
    $meta_data_info: 'won\'t work with the temp action',
    meta_data: {
        page_title: '',
        $keywords_type: 'textarea',
        keywords: '',
        $meta_description_type: 'textarea',
        meta_description: ''
    },

    tags: [
            {project: true}
          ]
})

Мы регистрируем нового помощника руля

assets /hbs_helpers / blog_list_by_tag.js 

var _ = require('lodash')
var Promise = require('bluebird')

var pagelist_generator = enduro.api.pagelist_generator

enduro.templating_engine.registerHelper('blog_list_by_tag', function (tags, options) {

    var pages
    return pagelist_generator.get_cms_list()
        .then((pagelist) => {
            var get_content_promises = []
            pages = _.chain(pagelist.structured.blog)
                .filter((o) => { return typeof o === 'object' }).value() // filter pages only

            for (page_id in pages) {
                var page = pages[page_id]

                function get_content (page) {
                    get_content_promises.push(enduro.api.flat.load(page.fullpath).then((content) => { page.content = content }))
                }

                get_content(page)
            }

            return Promise.all(get_content_promises)
        })
        .then(() => {
            pages = _.chain(pages)
                .sortBy('content.$date_value').reverse() // sort by date
                .filter((page) => { return page.content.published }) // remove unpublished              
                .filter( //filter by tag
                    (page) => {
                        var taged                       
                        _.forEach(tags, (value) =>{ return  _.findIndex(page.content.tags, value) != -1 ? taged = true : false })
                        return taged 
                    }
                )
                .value()

            return options.fn(pages)
        })
})

И, наконец, в контексте я использую недавно созданного помощника и передаю теги в качестве аргумента. 

{{#blog_list_by_tag tags}}

    {{#each this}}
        <article class="">

            <h2>
                <a href="/blog/">{{content.display_title}}</a>
            </h2>
            <p>More post data ....</p>
        </article>
    {{/each}}

{{/blog_list_by_tag}}
...