我正在使用Angular2 Dart 3.1.0。我正在动态加载一个组件,我想知道是否有一种方法可以输入<ng-content></ng-content>
的内容。我正在动态加载第三方组件,因此我无法替换ng-content使用情况。
我已经汇总了我当前实现的简化示例:
import 'dart:async';
import 'package:angular2/angular2.dart';
@Component(
selector: 'dynamic-component',
template: '''<div class="header">{{header}}</div>
<div><ng-content></ng-content></div>
<div class="footer">{{footer}}</div>''')
class DynamicComponent {
@Input()
String header;
@Input()
String footer;
}
@Component(
selector: 'wrapper-component',
template: '')
class WrapperComponent {
final ViewContainerRef _viewContainerRef;
final ComponentResolver _componentResolver;
WrapperComponent(this._viewContainerRef, this._componentResolver);
Future renderDynamicComponent() async {
var componentFactory = await _componentResolver.resolveComponent(DynamicComponent);
ComponentRef<DynamicComponent> componentRef = _viewContainerRef.createComponent(componentFactory);
componentRef.instance
..header = header
..footer = footer;
}
}