【问题标题】:Can't bind to 'routerLink' since it isn't a known property even after importing RouterModule无法绑定到“routerLink”,因为即使在导入 RouterModule 之后它也不是已知属性
【发布时间】:2021-10-16 14:10:43
【问题描述】:

我有一个简单的组件

<p>selector works!</p>
<a [routerLink]="['../']">
    <i class="material-icons">arrow_back</i>
</a>

应该包括一个后退按钮。但是我得到了错误

Can't bind to 'routerLink' since it isn't a known property of 'a'

即使 RouterModule 被导入到声明 selector.component 的模块中

@NgModule({
  declarations: [
    SelectorComponent
  ],
  imports: [
    CommonModule,
    RouterModule
  ]
})
export class MyModule { }

问题可以通过在app.module中导入MyModule来解决。

为什么会这样?

【问题讨论】:

    标签: angular typescript module angular-ui-router router


    【解决方案1】:

    您需要通过调用RouterModuleforRootforChild 方法来导入模块。

    @NgModule({
      declarations: [
        SelectorComponent
      ],
      imports: [
        CommonModule,
        RouterModule.forRoot([]), // with array of routes 
      ]
    })
    

    【讨论】:

    • 为什么只导入RouterModule还不够?
    • 我不知道好的文档可以给出明确的答案。调查angular.io/api/router/RouterModule#description 我可以推断这确保每个应用程序只提供一次路由器
    • 为什么只导入RouterModule还不够? -> 因为 Angular 必须知道路由是根路由还是子路由。
    • 如果不需要为模块设置路由?
    【解决方案2】:

    如果您的选择器组件是任何其他模块的一部分。

    您也应该在导入数组中导入RouterModule

    否则

    检查是否正确导入selector组件

    【讨论】:

    • 为什么需要在 AppModule 中导入 MyModule?
    • 如果您要使用的不仅仅是路由器插座。带有不同的模块。需要导入它。在 appmodule- 你将使用forRoot |对于子模块,您必须使用 forChild
    • 我明白了,但为什么呢?看起来有些模块和 realted 指令不包含在其他模块中声明的组件中,除非在 AppModule 中导入了声明模块
    • 你是对的,这取决于包发布者。如果您想创建新模块,您可以在其中导入所有必需的包并使用forRoot 将该模块导入 app.module 一次。所以它将可用于所有模块
    猜你喜欢
    • 2017-06-21
    • 2017-02-05
    • 2019-04-08
    • 2020-07-08
    • 2016-09-05
    • 2017-04-06
    • 1970-01-01
    • 2016-03-22
    相关资源
    最近更新 更多