Angular 2：动态选择器属性

Question

我目前正试图看看在Angular 2中我们是否可以创建动态选择器/ html标签。例如，我想做这样的事情：

@Component({
    selector: 'my-app' + 'variableName',
    template: `
    <container> </container>
    `,
    directives: [ContainerComponet]
})

所以我可以做类似的事情：

<my-app + {{variableName}}> <!-- the variable name would be coming from a public variable inside my component-->

在某种程度上，我的组件的实现需要多次发生，我知道我可以复制/粘贴我拥有的并拥有多个组件但是我觉得必须有一个更聪明的方法。

Answer 1

这对我有用，在我的情况下，模板是相同的，但需要根据某些值更改（着色更改）。因此，在父组件中，这些值已设置，并且基于我的组件表现不同

Componenet代码：

sample.ts

@Component({
    selector: 'my-app-sample' 
    templateUrl: 'sample.html'
})

 @Input() myInput: MyInput;

此组件和模板（sample.ts）是另一个组件的子级。 在父模板中，我们＆＃34; drop＆＃34;样本选择器：my-app-sample

我放弃选择器（父级）的模板：

<div>
<my-app-sample [myInput] = "anotherVariable"</my-app-sample>
</div>

注意：anotherVariable值在Component父级中设置。