我在HTML表中使用自定义组件时遇到了一个问题，它似乎妨碍了标记
我的应用程序组件HTML:
<table cellpadding="0" cellspacing="0" border="0">
<tbody>
<app-item-form *ngFor="let item of checklists?.items" [child]="item"></app-item-form>
</tbody>
</table>
app-item-form.html:
<table cellpadding="0" cellspacing="0" border="0">
<tbody>
<app-item-form *ngFor="let item of checklists?.items" [child]="item"></app-item-form>
</tbody>
</table>
应用程序-项目-表单。ts:
@Component({
selector: 'app-item-form',
templateUrl: './item-form.component.html',
styleUrls: ['./item-form.component.scss']
})
export class ItemFormComponent implements OnInit {
@Input()
child: ItemChecklistModel;
您可以为自定义组件指定属性选择器，例如[someSelector]。 这个选择器可以放在元素上以保留原始标记。 这种模式在您的情况下也很有用，因为在创建可访问的组件（如输入）时，需要指定几十个@Input()（例如，角材料输入）:
组件:
import { Component, Input } from '@angular/core';
@Component({
selector: '[hello]',
template: `<h1>{{ name }} <ng-content></ng-content></h1>`,
styles: [`h1 { font-family: Lato; color: red; }`]
})
export class HelloComponent {
@Input() name: string;
}
模板:
<div hello>foobar</div>
下面是一个行动中的例子。
希望能帮上忙！
