Question

我有一个包含通用弹出窗口的组件，因此它实现了接口 PopupParent

@Injectable()
@Component(
    //...
)
class SubjectListComponent implements OnInit, PopupParent {
}

泛型类 InfoPopup 需要抽象地处理其父类（实现 PopupParent ），所以我想获取其接口注入的父类（而不是由具体类 SubjectListComponent ）注入

class InfoPopup {
  final PopupParent _parent;

  InfoPopup(this._parent);
  //...non relevant code
}

问题是 SubjectListComponent 在注入器中被类注册，因此注入器无法找到要注入 InfoPopup 类的内容。

如果我尝试手动声明我的 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不会将此识别为关键字，但会在SubjectListComponent.dart中搜索名为 this 的属性

为此问题创建了两个问题： https://github.com/dart-lang/site-webdev/issues/514 https://github.com/dart-lang/site-webdev/issues/515

Answer 1

这可以通过提供别名来实现。 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"

接口的依赖注入

1 个答案: