相关疑难解决方法(0)

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

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

    <table>
        <tr *ngFor="#line of data">
            .... content ....
        </tr>
    </table>

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

    <table>
        <table-line *ngFor="#line of data" [data]="line">
        </table-line>
    </table>

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

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

    <table>
        <table-line ...>
            <tbody>
                <tr> ....

我怎样才能做到这一点？

我开始使用Angular 2(版本2.0.0-alpha.46)并创建一些组件.

使用以下代码创建组件时:

打字稿:

import {ComponentMetadata as Component, ViewMetadata as View} from 'angular2/angular2';

@Component({
   selector: 'my-component'
})

@View({
     template: '<div class="myClass">Hello My component</div>'
 })

export class MyCompoent{
    constructor() {
        console.info('My Component Mounted Successfully');
    }
}

HTML:

<my-component></my-component>

它工作正常,但是当我这样做时Inspect element,我可以看到这样生成的标签:

输出HTML

<my-component>
    <div>Hello My component</div>
<my-component>

问题

它将<my-component>标记保存在HTML中,并且我的一些CSS没有按预期工作.

题

有没有办法删除<my-component>类似于角1 的标签(replace: true在指令中)？

在角度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>

但由于创建了特殊元素标签,因此不会呈现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> …