Question

我尝试通过在Component类中添加@Input来传递额外的属性。但是，我不确定如何传递组件指令中定义的所有属性，即任何新类，id

<my-directive disabled style="color: red;">{{my name}}</my-directive>

应该扩展到

<button class="my-button" disabled style="color: red">{{my name}}</button>

在此，class属性被写入组件＆amp;的模板文件中。 disabled style="..."将传递给模板。

// Component code

import { Component } from 'angular/core';

@Component({
 selector: 'my-directive',
 template: `
          <button class="my-button">It should be fetched from outside</button>
        `
});


export class MyDirective{    
    constructor(){

    }
}

Answer 1

对于style，您可以使用ngStyle设置任意样式，但这与输入无关。

您只能逐个设置所有输入。无法一次设置多个或所有输入。

您可以自己创建一个输入，并将传递的值传播到输入，如

@Input() input1;
@Input() input2;
@Input() input3;

@Input() 
set all(data) {
  this.input1 = data.input1 || this.input1;
  this.input2 = data.input2 || this.input2;
  this.input3 = data.input3 || this.input3;
}

AngularJS 2：将组件额外属性传递给模板

1 个答案: