angular - 如何将值传递给 Angular Directive(指令)

Question

代码和说明已更新

我希望该指令根据 bool 值禁用或启用，但无论我通过 isDraggable 变量发送什么值(真/假)，在这两种情况下，指令都已启用。

这段代码需要改进什么？

@Directive({
  selector: '[movableObject]'
})
export class MovableDirective extends DraggableDirective {
  @Input() movableObject: boolean;
}

@Component({
  selector: 'app-panel',
  template: `<div [movableObject]="isDraggable"></div>`,
  styleUrls: ['./panel.component.scss'],
})
export class PanelComponent implements OnInit {
  private isDraggable: boolean = true;
}

Answer 1

注意@Input 装饰器。它将元数据添加到类中，使指令的 movableObject 属性可用于绑定(bind)。

@Directive({
  selector: '[movableObject]'
})
export class MovableDirective extends DraggableDirective {
   @Input() movableObject: boolean;
}

@Component({
  selector: 'app-panel',
  template: `<div [movableObject]="isDraggable"></div>`,
  styleUrls: ['./panel.component.scss'],
})
export class PanelComponent implements OnInit {
  private isDraggable: boolean;
}