将属性添加到Angular 2组件选择器

发布时间：2020-12-17 09:16:28 所属栏目：安全来源：网络整理

导读：我想将属性添加到我在angular 2组件实现中创建的自定义选择器. @Component({selector: 'my-node',// add attributes to this selector template: `div ng-content/ng-content /div` }) 所以,当我做 my-node dom使用这些额外属性生成选择器 my-node flex =“2

我想将属性添加到我在angular 2组件实现中创建的自定义选择器.

@Component({
selector: 'my-node',// add attributes to this selector 
template: `<div> <ng-content></ng-content> </div>`    
})

所以,当我做< my-node> dom使用这些额外属性生成选择器

< my-node flex =“25”layout =“row”>

我不希望每次执行< my-node>时都对这些属性进行硬编码.我希望这些属性成为选择器构造模板的一部分.

像这样的东西是我正在寻找但却没有在api中看到类似的东西

@Component({
selector: 'my-node',selectorAttributes: `layout="row"`  // generates <my-node layout="row">
template: `<div> <ng-content></ng-content> </div>`    
})

使用@Component元数据属性的主机.

@Component({
   selector: 'my-node',// add attributes to this selector 
   template: `<div> <ng-content></ng-content> </div>`,host: { // this is applied to 'my-node' in this case
      "[class.some-class]": "classProperty","[attr.some-attr]": "attrProperty",},})

这是一个例子plunk.请参阅app / app.component.ts

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!