如何使用 knp_paginator 将锚点附加到 url
Posted
技术标签:
【中文标题】如何使用 knp_paginator 将锚点附加到 url【英文标题】：how can i append an anchor to the url using knp_paginator 【发布时间】：2020-07-28 20:23:22 【问题描述】：我正在使用 symfony 4.4 开发一个电子商务网站。我在页面中心有一个带有id="projects" 的部分，因此您必须向下滚动才能到达它。此部分是使用我的 ProductRepository 中的 knp paginator 构建的，以使其与搜索表单一起使用，并且该部分的某些部分是指向另一个页面的链接，该页面也具有您必须滚动到的产品部分。我想将 #projects 附加到 URL 以将用户向下滚动到该部分，但我不知道如何按照 knp 分页器构建页面的方式执行此操作。
我试图在 twitter_bootstrap_v4_pagination.html.twig（我在 knp_paginator.yaml 中定义的模板）中的路径中附加一个#projects，但是当我这样做时，分页器不再工作并且#projects没有附加到 url。
% if pageCount > 1 %
<nav>
% set classAlign = (align is not defined) ? '' : align=='center' ? ' justify-content-center' : (align=='right' ? ' justify-content-end' : '') %
% set classSize = (size is not defined) ? '' : size=='large' ? ' pagination-lg' : (size=='small' ? ' pagination-sm' : '') %
<ul class="pagination classAlign classSize ">
% if previous is defined %
<li class="page-item">
<a class="page-link" rel="prev" href=" path(route, query|merge((pageParameterName): previous)) #projects">« 'label_previous'|trans(, 'KnpPaginatorBundle') </a>
</li>
% else %
<li class="page-item disabled">
<span class="page-link">« 'label_previous'|trans(, 'KnpPaginatorBundle') </span>
</li>
% endif %
% if startPage > 1 %
<li class="page-item">
<a class="page-link" href=" path(route, query|merge((pageParameterName): 1)) #projects">1</a>
</li>
% if startPage == 3 %
<li class="page-item">
<a class="page-link" href=" path(route, query|merge((pageParameterName): 2)) #projects">2</a>
</li>
% elseif startPage != 2 %
<li class="page-item disabled">
<span class="page-link">…</span>
</li>
% endif %
% endif %
% for page in pagesInRange %
% if page != current %
<li class="page-item">
<a class="page-link" href=" path(route, query|merge((pageParameterName): page)) #projects"> page </a>
</li>
% else %
<li class="page-item active">
<span class="page-link"> page </span>
</li>
% endif %
% endfor %
% if pageCount > endPage %
% if pageCount > (endPage + 1) %
% if pageCount > (endPage + 2) %
<li class="page-item disabled">
<span class="page-link">…</span>
</li>
% else %
<li class="page-item">
<a class="page-link" href=" path(route, query|merge((pageParameterName): (pageCount - 1))) #projects"> pageCount -1 </a>
</li>
% endif %
% endif %
<li class="page-item">
</li>
% endif %
% if next is defined %
<li class="page-item">
<a class="page-link" rel="next" href=" path(route, query|merge((pageParameterName): next)) #projects"> 'label_next'|trans(, 'KnpPaginatorBundle') »</a>
</li>
% else %
<li class="page-item disabled">
<span class="page-link"> 'label_next'|trans(, 'KnpPaginatorBundle') »</span>
</li>
% endif %
</ul>
</nav>
% endif %
如果我将 #projects 更改为我的 index.html.twig 中不存在的另一个 ID，例如 #randomId，则分页器工作正常，并且 URL 更改为“http://127.0.0.1:8000 /home?page=2#randomId"，但它并没有解决我的问题。
注意：我也尝试将 url 手动更改为 http://127.0.0.1:8000/home?page=2#projects 并且它有效。我不知道为什么它不接受 index.html.twig 中的现有 id。
如果需要这里是控制器：
<?php
namespace App\Controller;
use App\Data\SearchData;
use App\Entity\Contact;
use App\Entity\ContactDevis;
use App\Entity\Evv;
use App\Form\ContactType;
use App\Form\ContactDevisType;
use App\Form\SearchForm;
use App\Repository\ProduitRepository;
use App\Repository\EvvRepository;
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\Routing\Annotation\Route;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
/**
* @Route("/")
*/
class EnoveController extends AbstractController
/**
* @Route("/home", name="enove_index", methods="GET","POST")
*/
public function index(ProduitRepository $produitRepository, EvvRepository $evvRepository, Request $request , Request $request_contact, Request $request_devis, \Swift_Mailer $mailer)
$contact = new Contact();
$contactdevis = new ContactDevis();
$data = new SearchData();
$evv = new Evv();
$data->page = $request->get('page',1);
$form_filter = $this->createForm(SearchForm::class, $data);
$form_filter->handleRequest($request);
//dd($data);
$evv = $evvRepository->findAll();
$produit = $produitRepository->findSearch($data);
$form_contact = $this->createForm(ContactType::class, $contact);
$form_contact->handleRequest($request_contact);
if($form_contact->isSubmitted() && $form_contact->isValid())
$contact = $form_contact->getData();
$this->addFlash('success', 'votre email à été acheminer à Enove');
$message = (new \Swift_Message('Nouveau contact'))
// On attribue l'expéditeur
->setFrom($contact->getEmail())
// On attribue le destinataire
->setTo('zwayten111@gmail.com')
// On crée le texte avec la vue
->setBody(
$this->renderView(
'emails/contact.html.twig', compact('contact')
),
'text/html'
)
;
$mailer->send($message);
return $this->redirectToRoute('enove_index' ,
[
'produits' => $produit,
'form_filter' => $form_filter->createView(),
'evvs' =>$evv,
] );
$form_devis = $this->createForm(ContactDevisType::class, $contactdevis);
$form_devis->handleRequest($request_devis);
if($form_devis->isSubmitted() && $form_devis->isValid())
$contactdevis = $form_devis->getData();
$this->addFlash('success', 'votre email à été acheminer à Enove');
$message2 = (new \Swift_Message('Devis'))
// On attribue l'expéditeur
->setFrom($contactdevis->getEmail())
// On attribue le destinataire
->setTo('zwayten111@gmail.com')
// On crée le texte avec la vue
->setBody(
$this->renderView(
'emails/contact_devis.html.twig', compact('contactdevis')
),
'text/html'
)
;
$mailer->send($message2);
//dd($contactdevis);
return $this->redirectToRoute('enove_index' ,
[
'produits' => $produit,
'form_filter' => $form_filter->createView(),
'evvs' =>$evv,
] );
//dump($request->request);
return $this->render(
'FrontEndEnove/index.html.twig',
[
'produits' => $produit,
'form_filter' => $form_filter->createView(),
'form_contact' => $form_contact->createView(),
'form_devis' => $form_devis->createView(),
'evvs' => $evv,
]
);
【问题讨论】：
嗨zwayten，谢谢你的提问！请尝试格式化和编辑您的帖子，使其尽可能清晰。目前很难遵循 1) 你正在尝试做什么 2) 你已经尝试过什么，以及 3) 你得到了什么结果而不是你期望的结果。如果您遇到问题，将它分成 3 个部分是个好主意！这可能会很困难，尤其是如果英语不是您的第一语言，但它会帮助您更快地找到更好的答案:) 请参阅 ***.com/help/how-to-ask 以获取其他帮助 Timofey 'Sasha' Kondrashov 谢谢你我编辑了这篇文章，我希望它比旧的更清晰，更有条理 非常感谢！我重新格式化了您写的内容，以隔离我认为您的问题所在。不幸的是，我不知道答案，但我认为现在有人可以更容易地帮助您，如果您认为可以使其更清楚，或者缺少信息或信息过多，请随时进一步编辑。我删除了几个看起来不相关的文件。好机会:) 【参考方案1】：在我的情况下，我更改了 ProductRpository 并添加了这个
$query = $query->getQuery();
$pagination = $this->paginator->paginate($query,$search->page,6);
$pagination->setParam('_fragment', 'projects');
return $pagination;
问题依然存在，猜猜我的模板有什么问题，jQuery 迫使它返回顶部，我只好删除它。
【讨论】：
以上是关于如何使用 knp_paginator 将锚点附加到 url的主要内容，如果未能解决你的问题，请参考以下文章