Question

我尝试使用角度升级机制将ng1项目升级到ng2。实际上我重写了一个提供多内容的组件（角度1.5多次转换/插槽）。

我的问题是，它可以在组件中使用多个内容，它会降级为在ng1环境中使用它。

我从昨天起就试着让它运转起来。如果我使用一个ng-content元素，它可以工作，但如果我尝试使用两个或者nore ng-content，我总是会出现一个错误，我使用x ng-content但提供了1个插槽。

我的组件看起来像

@Component({
selector: NgContentTest.UPGRADE_ELEMENT_NAME,
template: `
    <div>
        <div style="background-color:red ">
            <ng-content select="[con1]"></ng-content>
        </div>

        <div style="background-color: yellow; display: block;height: 55px;">
            <ng-content select="[cont2]"></ng-content>
        </div>
    </div>
`
})
export class NgContentTest {
    static UPGRADE_ELEMENT_NAME = 'ngContentTest';
}

Consumer是一个ng1指令，带有以下模板示例：

<ng-content-test> 
        <div cont1>
           Content - 1 
        </div>
        <div cont2>
            Content - 2
        </div>
</ng-content-test>

错误： 组件NgContentTest有2个元素，但只提供了1个插槽。

Answer 1

使用Angular 4.0.0修复此问题：https://github.com/angular/angular/pull/12675

我在底部张贴了plunkr，突出了问题。

SO requires some code为了直接链接到plunkr，显示ng1 / ng2混合应用程序所需的代码在这个答案的上下文中真的没有意义，所以...

TRUNCOVER

Angular2 - 具有降级的ng2组分的多内容

1 个答案: