Angular 如何将用户引导到页面的特定部分？

我有一个带有登录表单的页面。此表单由两个选项卡分隔。 在页脚中，我有一个链接，可以引导用户访问此页面，此表单位于第二个选项卡。我试过什么

我试图访问

#id

，但我找到了，因为表单是mat tab，而

ng模板mat tab label

不知道此语法。因此，解决方案必须是某种mat tab菜单方法。我可以创建这样的方法，因为它们在网络中有很多例子。但是当我点击链接时，我不知道如何调用这个方法。这是我的HTML代码

客户登录
我想买一个应用程序
你没有账户吗？
注册
或
LinkedIn
谷歌
合作伙伴登录
我想卖一个应用程序
你没有账户吗？
注册

简化问题描述：

• 进行客户登录时，默认情况下需要选择索引为0的选项卡
• 进行合作伙伴登录时，默认情况下需要选择索引为1的选项卡

因此，改变的关键信息是选项卡索引，这是一个简单的整数属性。通过指定URL参数（？tab=1）并读取该参数，您可以使用老式的丑陋方式来执行此操作。或者

您可以为同一组件定义两个路由，然后在路由中配置选项卡的索引以显示：

const routes: Routes = [
    {
        path: 'auth/login', // default customer login
        component: LoginComponent,
        data: {
            tab:0
        }
    },
    {
        path: 'auth/login/partner', // login for partners
        component: LoginComponent,
        data: {
            tab:1
        }
    }
];

然后在登录组件中，您可以读取选项卡的值并激活该选项卡

constructor(private route:ActivatedRoute)

ngOnInit() {
    const selectedTab = this.route.snapshot.data.tab;

    // activate tab with this index through material API
    // (or perhaps passing it to the mat-tab-group selectedIndex property in the html template is enough)
}

然后在页脚中，您可以链接到/auth/login/partner，以显示登录页面，默认情况下，partner选项卡处于激活状态

---

这个答案主要基于此。

@developer033你有什么想法吗？请发布页脚代码我发布它@thanveersha可能的输入错误：

id

属性不应该包含哈希字符，在

中，我知道就在我测试的时候，我在footer/auth/login#loginPartner中使用了它，从那里得到了复制粘贴，似乎当我发布代码时，我忘记删除了它，这就是我一直在寻找的答案，但我必须尝试看看它是否有效，但以防万一，你能告诉我如何使用参数解决这个糟糕的问题吗？如果你不介意的话，请工作@gimby还有，我接受你的回答，你能帮我更新我的帖子吗？我有一个错误，在HTML中应该是这样的，对吗？