More than one component matched on this element.
原文链接:More than one component matched on this element. – 每天进步一点点 (longkui.site)
angular项目,把A组件导出以后,在B中直接通过标签的方式引用了A组件,类似于下面这样:
<div>
<demo1></demo1>
</div>
然后打开B组件所在的页面,开始报下面的错误:
ERROR Error: Uncaught (in promise): Error: Template parse errors:
More than one component matched on this element.
Make sure that only one component’s selector can match a given element.
Conflicting components: AxxxxComponent,BxxxxxComponent ….
上面这个报错的大概意思是你在引用其他组件过程中,发现两个冲突的组件,我们打开BxxxxxComponent,找到selector部分,发现下面这样的代码:
@Component({
selector: 'list',
templateUrl: './list.component.html',
styleUrls: ['./list.component.less']
})
然后全局搜索这个selector,果然又发现一个名叫 list的select。
我前面在 https://www.longkui.site/program/frontend/angular-component/4564/ 这篇文章中说过,不要把所有的组件都起一样的名字,这样在引用的时候就可能会报错。
修改其中一个的selector名字,比如改成list2,然后保存重新调用,问题解决。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· AI技术革命,工作效率10个最佳AI工具