关于angular官方例子服务依赖注入@Injectable()传参的时候报错:Expected 0 arguments, but got 1

本文探讨了在使用Angular时遇到的@Injectable()装饰器传参错误,原因是尝试在Angular5版本中使用Angular6及更高版本的特性。解决方案包括升级Angular版本或采用其他注入方法。通过深入理解Angular不同版本的差异,可以有效解决此类问题。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

前言

前两天一个朋友想学习一下angular,在做官方的hero例子的时候,遇到了如下的问题,装饰器@Injectable()中不能传参,发截图问我是怎么回事,因为他完全是按照angular的官方文档敲的,这官方文档还能有错不成?让我们来一探究竟。
(他的是webstorm的IDE检测出来的错误,运行起来控制台会报一个一样的错误error:Expected 0 arguments, but got 1):
IDE检测报错

报错原因

网上有人提供了可避免错误的一种方式,就是不在这里面传参,老哥,你是认真的么。。。
首先,我们要知道,在@Injectable()中传参数是angular6以及之后版本才有的特性,之前的版本都无法传参,说到这里,好多朋友都反应过来了,是不是我的angular版本太低了?检查一下根目录的package.json文件(下图是我朋友截图发我的):
依赖包配置
他的是angular5的版本,当然不能使用angular6的新特性啦!

深入了解

为啥我传了参就会报错呢?我们看一下内部是如何要求的,先上两张图:
angular5版本的Injectable:
angular5 Injectable
angular7版本的Injectable:
(angular6之后都具有此特性,这里直接上angular7版本了):
angular6 injectable
从这两张图我们可以看出来,在angular6以及之后的版本我们是可以在@Injectable()中传参数进去,而angular5以及 之前版本,并不接受参数;所以这是一个版本问题引起的报错。

解决方法

有人这时候都在骂娘了,我进来看解决方法的,你给我分析一大堆干嘛,有啥用,别急,既然知道问题出在哪儿,我们就好解决了:

方法1、升级版本

既然angular5不行,那我就索性尝尝鲜,直接上最新版,螃蟹总要吃新鲜的,首先我们更新我们的脚手架,我的上一篇博客讲解了如何解决更新脚手架报错的问题《解决安装angular脚手架失败问题》
然后升级我们的项目依赖:
更新依赖
重新安装依赖包

npm install
方法2、使用其他方式注入

你不给我用我就不用呗,以前人家咋用我现在就老老实实咋用,不在@Injectable()中传参不就得了,日子还得过呢,我们其他的有两种注入方式:
1、在相应的模块中@NgModule()参数的providers中注入:
module注入service
2、在具体的组件中注入:
component注入service
以上两种方式都可以依赖注入service,但是可使用的范围不一样,具体场景大家自主选择。

结语

我们要知其然,还要知其所以然,网上给了我们解决方法,这远远不够,我们还要知道为什么会出现这样的问题!
希望能够解决大家工作和学习中的一些疑问,避免不必要的时间浪费,有不严谨的地方,也请大家批评指正,共同进步!
转载请注明出处,谢谢!
交流方式:QQ1670765991

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值