把手分页添加自定义链接

时间:2017-09-29 09:02:03

标签: javascript pagination handlebars.js

嘿所以我正在使用把手分页https://github.com/olalonde/handlebars-paginate

对于我的后端我正在配置它

pagination: {
                    page: page,
                    pageCount: pages.length,
                    active: true,
                    category:currentCategory
                  }

在前端我正在读它:

  <div class="paginator">
            <div class="btn-group" role="group" aria-label="...">
                <nav aria-label="Page navigation">
                    <ul class="pagination">
                        {{#paginate pagination type="first"}}
                        <li class="page-item{{#if disabled}} disabled{{/if}}">
                            <a class="page-link" href="/blog/category/{{{pagination.category}}}/{{n}}" aria-label="First">
                                <span aria-hidden="true">&laquo;</span>
                                <span class="sr-only">First</span>
                            </a>
                        </li>
                        {{/paginate}}


                        {{#paginate pagination type="previous"}}
                        <li class="page-item{{#if disabled}} disabled{{/if}}">
                            <a class="page-link" href="/blog/category/all/{{n}}" aria-label="Previous">
                                <span aria-hidden="true">&lsaquo;</span>
                                <span class="sr-only">Previous</span>
                            </a>
                        </li>
                        {{/paginate}}
                        <!--{{#paginate pagination type="middle" limit="6"}}-->
                        <!--<li class="page-item">-->
                            <!--<a class="page-link{{#if disabled}} disabled{{/if}}"-->
                               <!--href="/blog/category/all/{{n}}">{{n}}</a>-->
                        <!--</li>-->
                        <!--{{/paginate}}-->
                        {{#paginate pagination type="middle" limit="7"}}
                        <li {{#if active}}class="active" {{/if}}> <a class="page-link" href="/blog/category/all/{{n}}">{{n}}</a>
                        </li>
                        {{/paginate}}
                        {{#paginate pagination type="next"}}
                        <li class="page-item{{#if disabled}} disabled{{/if}}">
                            <a class="page-link" href="/blog/category/all/{{n}}" aria-label="Next">
                                <span aria-hidden="true">&rsaquo;</span>
                                <span class="sr-only">Next</span>
                            </a>
                        </li>
                        {{/paginate}}
                        {{#paginate pagination type="last"}}
                        <li class="page-item{{#if disabled}} disabled{{/if}}">
                            <a class="page-link" href="/blog/category/all/{{n}}" aria-label="Last">
                                <span aria-hidden="true">&raquo;</span>
                                <span class="sr-only">Last</span>
                            </a>
                        </li>
                        {{/paginate}}
                    </ul>
                </nav>
            </div>
        </div>

我的问题在这里:

当我尝试将此变量注入到它从未显示的分页的url时。 我尝试使用{{}}和三个卷曲{{{}}},但它从未出现过。 我也尝试在后端处理它:

pagination: {
                    page: page,
                    pageCount: pages.length,
                    active: true,
                  },
                  category:currentCategory

并阅读但它也不会显示出来。 我如何将这个变量注入我的分页URL?

1 个答案:

答案 0 :(得分:0)

所以实际上为了做到这一点,我必须创建一个把手助手,然后使用它。 所以这是我的帮手:

Handlebars.registerHelper( "getCategory", function (f){

                    return '/blog/category/'+currentCategory + '/' + f;
                });
(f)只是为了让它发挥作用!并获得正确的链接。 然后在视图上我用它很简单:

href="{{getCategory n}}"