Question

我是Angular的新手，正在学习角度布线部分

这里是第一个和第二个路由器链接，我使用了静态路径，第三个是我尝试使用表达式，并且有一个输入文本框，其模型为“ myRoute”。我试图在其中键入“ third”文本框和值绑定到模型“ myRoute”中，并且我在路由中定义了一个组件“ ThirdComponent”，但它不起作用

<input type="text" [(ngModel)]='myRoute'>
<nav>
  <ul>
     <li><a routerLink="first">First</a></li> 
     <li><a routerLink="second">Second</a></li>
     <li><a [routerLink]="['myRoute']">Third</a></li>

  </ul>
</nav>

这是我的路线

const appRoutes: Routes = [
  { path: 'first', component: FirstComponent },
  { path: 'second', component: SecondComponent },
  { path: 'third', component: ThirdComponent }
];

这是我收到的错误消息

错误：无法匹配任何路由。网址区段：“ myRoute” 错误：无法匹配任何路线。网址段：“ myRoute”

仅在我在文本框中输入文本“第三”后，我才单击第三组件链接

Answer 1

在原始代码中，您将routerLink绑定到文字字符串'myRoute'，如this answer中所述。以下语法将routerLink绑定到组件类的属性myRoute：

<a [routerLink]="myRoute">

Answer 2

从您的错误消息看来，“ myRoute”已作为字符串传递给路由器，而在您的路由器中，您为“ third”而不是“ myRoute”定义了路径。检查“ myRoute”上的数据绑定。

<a [routerLink]="myRoute">

应该做到！

通过表达式进行角路由

2 个答案: