第一次封装公共组件,也是遇到很多问题啊。记下困扰我当时很长时间的问题
错误
core.js:14597 ERROR Error: Uncaught (in promise): Error: Template parse errors:
Can’t bind to ‘list’ since it isn’t a known property of ‘app-ba-page-search’.
- If ‘app-ba-page-search’ is an Angular component and it has ‘list’ input, then verify that it is part of this module.
- If ‘app-ba-page-search’ is a Web Component then add ‘CUSTOM_ELEMENTS_SCHEMA’ to the ‘@NgModule.schemas’ of this component to suppress this message.
- To allow any property add ‘NO_ERRORS_SCHEMA’ to the ‘@NgModule.schemas’ of this component. ("
正解
没有引入模块
在collect.module.ts里引入公共组件所在模块
import { NgaModule } from '../../theme/nga.module';
imports: [
NgaModule
],
困扰了好多天,网上找了好久也没有找到,自己试了其他的方法,然后出现其他bug。下面是记录的当时试过不能解决的方法出现的错误
状况1
在collect.module.ts引入公共组件BaPageSearchComponent
import {BaPageSearchComponent} from '../../theme/components/ba-page-search/ba-page-search.component'
@NgModule({
declarations: [BaPageSearchComponent],
})
Error: Type BaPageSearchComponent is part of the declarations of 2 modules: NgaModule and CollectModule! Please consider moving BaPageSearchComponent to a higher module that imports NgaModule and CollectModule. You can also create a new NgModule that exports and includes BaPageSearchComponent then import that NgModule in NgaModule and CollectModule.
翻译:
错误:类型BaPageSearchComponent是两个模块声明的一部分:NgaModule和CollectModule!请考虑将BaPageSearchComponent移到更高的模块中,并导入NgaModule和CollectModule。你还可以创建一个新的NgModule,导出并包含BaPageSearchComponent,然后把这个NgModule导入到NgaModule和CollectModule中。
在两个模块都导入了该组件
状况2
在collect.module.ts加入
import { CUSTOM_ELEMENTS_SCHEMA} from '@angular/core';
@NgModule({
schemas: [ CUSTOM_ELEMENTS_SCHEMA ],
})
不报错,但是引入的公共组件没作用
后来我搜了下,这个是使用web组件的。web组件是不论哪个框架都可以使用。
之前用output获取方法时也遇到了几个问题,有一个我记的搜了好长时间也不知道咋解决的,但是现在我忘了是问题了。。。等我想起来在加吧
我是在这上边找到的解决办法,怎么封装写的也挺详细,具体想看可以看这上边。
https://www.jianshu.com/p/f34d88bbc821
总结下封装的是搜索框,遇到的主要问题是传值