相关疑难解决方法(0)

Angular2表行作为组件

我正在尝试使用angular2 2.0.0-beta.0

我有一个表格,行内容由angular2以这种方式生成:

    <table>
        <tr *ngFor="#line of data">
            .... content ....
        </tr>
    </table>
Run Code Online (Sandbox Code Playgroud)

现在这个工作,我想将内容封装到一个组件"table-line".

    <table>
        <table-line *ngFor="#line of data" [data]="line">
        </table-line>
    </table>
Run Code Online (Sandbox Code Playgroud)

在组件中,模板具有<tr> <td>内容.

但是现在桌子不再有用了.这意味着,内容不再显示在列中.在浏览器中,检查器向我显示DOM元素如下所示:

    <table>
        <table-line ...>
            <tbody>
                <tr> ....
Run Code Online (Sandbox Code Playgroud)

我怎样才能做到这一点?

angular

87
推荐指数
4
解决办法
6万
查看次数

删除由角度组件创建的主机HTML元素选择器

在角度2中,svg-rect是一个创建rect的组件,如下所示,

<svg height="550" width="450" x="0" y="0">
    <g id="svgGroup">
        <svg-rect>
        <!--template bindings={}-->
            <rect x="10" y="10" height="100" width="100" fill="red" stroke="#000" stroke-width="2"></rect>
        <!--template bindings={}-->
        </svg-rect>
        <svg-rect>
        <!--template bindings={}-->
            <rect x="10" y="10" height="100" width="100" fill="red" stroke="#000" stroke-width="2"></rect>
        <!--template bindings={}-->
        </svg-rect>
    </g>
</svg>
Run Code Online (Sandbox Code Playgroud)

但由于创建了特殊元素标签,因此不会呈现rect.如果删除了svg-rect标签,则会呈现rect

<svg height="550" width="450" x="0" y="0">
    <g id="svgGroup">
        <!--template bindings={}-->
        <rect x="10" y="10" height="100" width="100" fill="red" stroke="#000" stroke-width="2"></rect>
        <!--template bindings={}-->
        <!--template bindings={}-->
        <rect x="10" y="10" height="100" width="100" fill="red" stroke="#000" stroke-width="2"></rect>
        <!--template bindings={}-->
    </g> …
Run Code Online (Sandbox Code Playgroud)

svg angular

41
推荐指数
5
解决办法
2万
查看次数

标签 统计

angular ×2

svg ×1