Question

如何在我自己的自定义结构指令中访问Template Input Variables？

@Directive({
   selector: "[myCustomDirective]"
})
export class MyCustomDirective {
}

文档说A template input variable is a variable whose value you can reference within a single instance of the template.

<div *myCustomDirective="let visible = true"></div>

我知道模板现在有一个名为let-visible的输入，但我该如何访问它？

-------------------编辑-------------------

我希望能够使用结构指令接受多个输入。这可能吗？

我希望将一个输入分配给myCustomDirective本身，将一个输入分配给visible，这就是为什么我尝试使用let visible ngFor语法的原因。

Answer 1

您还必须在指令模块的顶部导入Input。

@Directive({
   selector: "[myCustomDirective]"
})
export class MyCustomDirective {
  @Input()
  set myCustomDirective(isVisible: boolean): void {
    // do something with isVisible
  }
}

指令的用法。

<div *myCustomDirective="true"></div>

Answer 2

您可以尝试以下方法：

            import { Directive,Input,...} from '@angular/core';
            @Directive({
               selector: "[myCustomDirective]"
            })
            export class MyCustomDirective {

            //using the Input decorator, we can accept the value of the property (in our case, it is myCustomDirective)and //use it inside our directive class.
             @Input('myCustomDirective')
              private visible: boolean;

              //console.log(this.visible);

            }

            // Use it, maybe like this:
            <div *myCustomDirective="true"></div>

Angular 2：如何访问结构指令中的模板输入变量

2 个答案: