Angular报错error NG8002: Can‘t bind to ‘XXX‘ since it isn‘t a known property of ‘XXX-XX‘

一、报错:

error NG8002: Can't bind to 'isTemplate' since it isn't a known property of 'create-home'.

1. If 'create-home' is an Angular component and it has 'isTemplate' input, then verify that it is part of this module.

2. If 'create-home' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. 

error NG8002: Can't bind to 'isTemplate' since it isn't a known property of 'create-home'.
1. If 'create-home' is an Angular component and it has 'isTemplate' input, then verify that it is part of this module.
2. If 'create-home' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

27         <create-home [isTemplate]="isTemplate" ></create-home>
                        ~~~~~~~~~~~~~~~~~~~~~~~~~

  libs/home/fe/view/src/lib/pages/main/main.page.ts:21:16
    21   templateUrl: './main.page.html',
                      ~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component MainPage.

二、分析问题

看上面的报错信息:Can't bind to 'isTemplate' since it isn't a known property of 'create-home',是因为给组件绑定了isTemplate导致报错

一般这种情况有两种原因:

1.没有在主模块app.module.ts导入FormsModule

2.没有在子组件(这里是create-home组件)接收isTemplate

三、解决

1、在主模块app.module.ts导入FormsModule并配置


import { CreateComponent } from './components'
import { FormsModule } from '@angular/forms'
@NgModule({
  imports: [
    FormsModule
  ],
  declarations: [CreateComponent],
})

2、在子组件create.componet.ts接收isTemplate

 @Input() isTemplate: boolean = false

import { Component, OnInit, Input} from '@angular/core'
@Component({
  selector: 'create-home',
  templateUrl: './create.componet.html',
})
export class CreateComponent implements OnInit{

  @Input() isTemplate: boolean = false

  constructor() {}

  async ngOnInit() {
     
  }

}

四、类似的报错

error NG8001: 'create-home' is not a known element: 1. If 'create-home' is an Angular component, then verify that it is part of this module. 2. If 'create-home' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

这个报错是因为'create-home'组件没有在主模块导入和声明declarations

解决办法:declarations: [CreateComponent]

import { CreateComponent } from './components'
import { FormsModule } from '@angular/forms'
@NgModule({
  imports: [
    FormsModule
  ],
  declarations: [CreateComponent],
})

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
回答: 当出现"Can't bind to 'ngModel' since it isn't a known property of 'input'"误时,这是因为没有在当前组件所属的模块中引用FormsModule。要解决这个问题,你需要在当前组件所属的模块中添加FormsModule的引用。具体做法是在module.ts文件中添加以下代码:import { FormsModule } from '@angular/forms';然后在imports数组中加入FormsModule。这样就可以解决"Can't bind to 'ngModel' since it isn't a known property of 'input'"误了。\[1\]\[2\]\[3\] #### 引用[.reference_title] - *1* [error NG8002: Can‘t bind to ‘ngModel‘ since it isn‘t a known property of ‘input‘.](https://blog.csdn.net/qq_37860634/article/details/120401597)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^koosearch_v1,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* [Can‘t bind to ‘ngModel‘ since it isn‘t a known property of ‘nz-range-picker‘.解决angular使用...](https://blog.csdn.net/qq_38594056/article/details/126465949)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^koosearch_v1,239^v3^insert_chatgpt"}} ] [.reference_item] - *3* [AngularngModelangular-can‘t-bind-to-‘ngModel‘---](https://blog.csdn.net/bobo789456123/article/details/117155567)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^koosearch_v1,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值