Angular的走马灯页面跳转问题

SURI12138

于 2020-06-09 14:36:27 发布

阅读量1.3k

点赞数

文章标签： angular

本文链接：https://blog.youkuaiyun.com/SURI0114/article/details/106641014

版权

这篇博客记录了作者在使用Angular 9.1.2版本时遇到的走马灯页面跳转问题。由于现有中文网站上的Angular资源多为旧版本，作者指出这些答案已失去参考价值。文章详细说明了Angular API中goTo方法的误用情况，错误示例为`(click)="goTo(1)"`，并提供了正确的调用方式`(click)="carousel.goTo(1)"`。同时，作者提醒走马灯页面的ID需用数组存储，并且跳转时应从0开始。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

写的时候碰到的问题在这里记录一下，看不懂可以留言问我
现有的中文网站关于angular的回答大多都是很早之前的版本
没有什么参考意义
本文所使用的NG-ZERRO版本是9.1.2

angular的走马灯的api文档中有个默认的goTo方法

文档原文：
goTo(slideNumber) 切换到指定面板

在直接调用该方法时会提示写法错误

错误写法（click） = “goTo(1)”
正确写法 (click) = “carousel.goTo(1)”

PS：走马灯跳转页面的绑定id是用数组存的
跳转页面时要从0开始

贴上部分代码

<ul nz-menu nzMode="horizontal">
  <li nz-menu-item nzMatchRouter>
    <a (click) = "carousel.goTo(0)">页面1</a>
  </li>
  <li nz-menu-item nzMatchRouter>
    <a (click) = "carousel.goTo(1)">页面2</a>
  </li>
  <