Angular依赖注入,angular组件复用
角度组件如何相互通信？什么是依赖注入？下面这篇文章带你简单了解一下组件通信的方法，并介绍依赖注入，希望对你有帮助！
1. 组件通讯
1.1 向组件内部传递数据
app-favorite[is favorite]= true /app-favorite//favorite . component . ts
从“@angular/core”导入{ Input }；
导出类FavoriteComponent {
@ Input()is favorite:boolean=false；
}1.2 组件向外部传递数据
要求：通过单击子组件中的按钮，将数据传递给父组件。
！-子组件模板-
button(click)= onclick() click/button//子组件类
从“@angular/core”导入{ EventEmitter，Output }
导出类FavoriteComponent {
@ Output()change=new event emitter()
onClick() {
This.change.emit({ name:张三 })
}
}!-父组件模板-
app-favorite(change)= onchange($ event)/app-favorite//父组件类
导出类AppComponent {
onChange(事件：{ name: string }) {
console.log(事件)
}
}
2. 依赖注入
2.1 概述
依赖注入(DI)是面向对象程序设计中的一种设计原则，用于降低代码之间的耦合性。
类别邮件服务{
构造函数(APIKEY) {}
}
类EmailSender {
邮件服务：邮件服务
构造函数(){
this.mailService=新邮件服务( APIKEY1234567890 )
}
sendMail(邮件){
this.mailService.sendMail(邮件)
}
}
const email sender=new email sender()
EmailSender。sendmail(mail)EmailSender类与MailService类一起运行，后者依赖于MailService类，后者是Email Sender类的依赖项。
上面写的耦合度太高，代码不健壮。如果MailService类改变了参数的传递方式，EmailSender类中的内容也会改变。
类EmailSender {
邮件服务：邮件服务
构造函数(邮件服务：邮件服务){
this . mail service=mail service；
}
}
const mailService=新邮件服务( APIKEY1234567890 )
const EmailSender=new Email Sender(mailservice)在实例化Email Sender类时，将其依赖项以构造函数参数的形式注入到类内部。这种写法就是依赖注入。
依赖注入降低了代码之间的耦合度，增加了代码的可维护性。mail类中的代码更改将不再影响EmailSender类。
2.2 DI 框架
Angular有自己的DI框架，隐藏了实现依赖注入的过程。对于开发者来说，只需要简单的代码就可以使用复杂的依赖注入函数。
Angular的DI框架中有四个核心概念：
依赖：组件所依赖的实例对象，以及服务实例对象。
Token:获取服务实例对象的ID。
注入器：注入器，负责创建维护服务类的实例对象，将服务实例对象注入组件。
提供者：配置注入器的对象，指定服务类以创建服务实例对象，并获取实例对象的标识。
2.2.1 注入器 Injectors
注入器负责创建服务类实例对象，并将服务类实例对象注入所需的组件。
创建注射器
从“@angular/core”导入{ ReflectiveInjector }
//服务类别
类别邮件服务{}
//创建一个注入器并将其传递给服务类
constin jector=reflective injector . resolved create([mail service])，以获取注入器中的服务类实例对象。
constmailservice=injector . get(mailservice)服务实例对象是singleton模式，创建服务实例后，注入器会缓存服务实例。
const mail service 1=injector . get(mail service)
const mail service 2=injector . get(mail service)
console . log(mail service 1==mail service 2)//true不同的注入器返回不同的服务实例对象。
const injector=reflective injector . resolve andcreate([mail service])
const child injector=injector . resolveandcreatechild([mail service])
const mail service 1=injector . get(mail service)
const mail service 2=child injector . get(mail service)
console . log(mail service 1==mail service 2)//false服务实例的搜索类似于函数作用域链。如果可以找到当前级别，则使用当前级别；如果找不到当前级别，将在父级中搜索。
常量注射器=反射注射器。解决并创建([邮件服务])
const子注射器=注射器。resolveandcreatechild([])
常量邮件服务1=注射器。获取(邮件服务)
常量邮件服务2=子注入器。获取(邮件服务)
控制台。log(邮件服务1===邮件服务2)//true2.2.2 提供者 Provider
配置注入器的对象，指定了创建实例对象的服务类和访问服务实例对象的标识
常量注射器=反射注射器。解决并创建([
{提供：邮件服务，使用类别：邮件服务}
])访问依赖对象的标识也可以是字符串类型
常量注射器=反射注射器。解决并创建([
{提供：邮件，使用类别：邮件服务}
])
const邮件服务=注射器。获取(邮件)使用值
常量注射器=反射注射器。解决并创建([
{
提供："配置",
useValue: Object.freeze({
API键：“API 1234567890”，
API scret:“500-400-300”
})
}
])
const Config=注射器。获取(配置)将实例对象和外部的引用建立了松耦合关系，外部通过标识获取实例对象，只要标识保持不变，内部代码怎么变都不会影响到外部
更多编程相关知识，请访问：编程视频！以上就是带你了解有角的中的组件通讯和依赖注入的详细内容，更多请关注我们其它相关文章！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。