angular - Angular 2 属性组件将模板包装在输入标签中

Question

我正在尝试在 Angular 2 中创建一个 DatePicker 组件。

我希望这是一个属性组件，所以我的 html 看起来像：

<input type='text' datePicker [(ngModel)]='myDate' />

问题是在渲染模板时，它将它包装在输入标签内。

我的模板如下所示：

<ng-content></ng-content>
<div class="datePickerContainer">Test</div>

当我在浏览器中检查元素时，它看起来像：

<input class='ng-pristine ng-valid' datepicker type="text" ng-reflect-date-picker>
    <div class="datePickerContainer">Test</div>
</input>

这使得它对浏览器不可见。它确实需要附加在输入标签之后。

我期待看到的是：

<input class='ng-pristine ng-valid' datepicker type="text" ng-reflect-date-picker />
<div class="datePickerContainer">Test</div>

如何让我的模板在输入标签之后呈现，而不是将其包裹在其中？