访问组件模板中的指令变量

Question

我有这个指令=>

export class ThrottleClickDirective implements OnInit, OnDestroy {
@Input() 
throttleTime = 500;
@Output() 
throttleClick = new EventEmitter();
public throttling = false;
private clicks = new Subject();
private subscription: Subscription;
constructor() { }
ngOnInit() {
this.subscription = this.clicks.pipe(
throttleTime(this.throttleTime)
).subscribe(e => {
this.throttleClick.emit(e)
this.throttling = false;   
});
}
ngOnDestroy() {
this.subscription.unsubscribe();
}
@HostListener('click', ['$event'])
clickEvent(event) {
event.preventDefault();
event.stopPropagation();
this.clicks.next(event);
this.throttling = true;
}
}

这是我的模板

<button mat-button *ngFor="let button of buttons" 
[ngClass]="[((button.className) ? button.className : ''), 'custom-popup-button']" 
[disabled]="(button.type === 'confirmation')"
appThrottleClick 
(throttleClick)="button.action();" 
[throttleTime]="500">
{{button.text}}
</button>

如果当前 butthrottling为 true，我想禁用我的按钮(以便它显示点击已被考虑在内。

有没有办法从模板(指令外部(访问该变量

这个组件(按钮来自的组件(是一个通用组件，作为不同数量的按钮基于设置，所以我不能真正在其上存储变量。最好的方法是在disable和throttling之间建立某种联系

Answer 1

这样的东西可以工作

@HostBinding('class.myDisableClass') throttling:boolean;

和 CSS

.myDisableClass button{
cursor: not-allowed;
pointer-events: none;
}