Question

我通过Angular网络应用中的菜单设置了路由。该菜单的routerLinks设置如下面的主页链接：

<a routerLink="home">
            <button md-menu-item>
                <md-icon class="material-icons"> home </md-icon>
                <span> Home </span>
            </button>
        </a>

app.router包含：

export const router: Routes = [
    { path: '', redirectTo: 'home', pathMatch: 'full'},
    { path: 'home', component: HomeComponent },
];

我希望组件中有一个按钮，可以重定向到普通菜单中没有的查询表单，但是在组件中的按钮上放置链接似乎不起作用。这是为什么？

对我来说，理想的做法是将函数放在调用路径的组件中的html元素中 - 这可能吗？

Answer 1

如果我理解正确，是的，当然可以。

只需将Router添加到组件构造函数中：

constructor(private router: Router) {}

然后你可以在你的函数中调用来自Router类的导航函数，这将在点击按钮后调用，例如：

this.router.navigate(['home']);

另一种可能性是将[routerLink]放在html标签中：

<a [routerLink]="['/home']">Go To Home</a>

检查一下：

https://angular.io/guide/router

https://angular.io/api/router/Router

Angular 4函数调用路由

1 个答案: