接口的依赖注入
dependency injection for interfaces
我有一个包含通用弹出窗口的组件,因此它实现了接口 PopupParent
@Injectable()
@Component(
//...
)
class SubjectListComponent implements OnInit, PopupParent {
}
泛型 class InfoPopup 需要抽象地处理其父级(实现 PopupParent),所以我想获取通过其接口注入的父级(而不是通过其具体注入 class SubjectListComponent)
class InfoPopup {
final PopupParent _parent;
InfoPopup(this._parent);
//...non relevant code
}
问题是 SubjectListComponent 是由 class 在注入器中注册的,因此注入器找不到要注入到 中的内容InfoPopup class.
如果我尝试手动声明我的 SubjectListComponent,我发现它必须在提供程序常量中完成。但是当我声明我的组件时,我仍然没有 SubjectListComponent 的实例...
我该怎么做?
我还尝试将父级传递给@Input:
@Component(
selector: 'info-popup',
templateUrl: 'info_popup.html',
styleUrls: const ['info_popup.css'],
)
class InfoPopup {
@Input()
final PopupParent parent;
InfoPopup(this._parent);
//...non relevant code
}
但后来我陷入了如何从组件客户端注入 this 实例的问题:
subject_list_comp.html:
<div>
<info-popup [parent]="this"></info-popup>
</div>
因为 dart angular 无法将 this 识别为关键字,但它会搜索名为 this[= 的 属性 47=] 在 SubjectListComponent.dart
为此问题创建了两个问题:
https://github.com/dart-lang/site-webdev/issues/514
https://github.com/dart-lang/site-webdev/issues/515
这可以通过提供别名来实现。 multi: true
允许添加多个别名。无法自动派生接口。
@Component(
providers: [
const Provider(PopupParent, useExisting: SubjectListComponent, multi: true),
const Provider(PopupParent, useExisting: FooComponent, multi: true)
]
)
class InfoPoupup ...
更新
制作
[parent]="this"
工作,你可以添加一个 getter 到组件
get self => this;
然后使用
[parent]="self"
我有一个包含通用弹出窗口的组件,因此它实现了接口 PopupParent
@Injectable()
@Component(
//...
)
class SubjectListComponent implements OnInit, PopupParent {
}
泛型 class InfoPopup 需要抽象地处理其父级(实现 PopupParent),所以我想获取通过其接口注入的父级(而不是通过其具体注入 class SubjectListComponent)
class InfoPopup {
final PopupParent _parent;
InfoPopup(this._parent);
//...non relevant code
}
问题是 SubjectListComponent 是由 class 在注入器中注册的,因此注入器找不到要注入到 中的内容InfoPopup class.
如果我尝试手动声明我的 SubjectListComponent,我发现它必须在提供程序常量中完成。但是当我声明我的组件时,我仍然没有 SubjectListComponent 的实例...
我该怎么做?
我还尝试将父级传递给@Input:
@Component(
selector: 'info-popup',
templateUrl: 'info_popup.html',
styleUrls: const ['info_popup.css'],
)
class InfoPopup {
@Input()
final PopupParent parent;
InfoPopup(this._parent);
//...non relevant code
}
但后来我陷入了如何从组件客户端注入 this 实例的问题:
subject_list_comp.html:
<div>
<info-popup [parent]="this"></info-popup>
</div>
因为 dart angular 无法将 this 识别为关键字,但它会搜索名为 this[= 的 属性 47=] 在 SubjectListComponent.dart
为此问题创建了两个问题: https://github.com/dart-lang/site-webdev/issues/514 https://github.com/dart-lang/site-webdev/issues/515
这可以通过提供别名来实现。 multi: true
允许添加多个别名。无法自动派生接口。
@Component(
providers: [
const Provider(PopupParent, useExisting: SubjectListComponent, multi: true),
const Provider(PopupParent, useExisting: FooComponent, multi: true)
]
)
class InfoPoupup ...
更新
制作
[parent]="this"
工作,你可以添加一个 getter 到组件
get self => this;
然后使用
[parent]="self"