typescript - Hur man skickar värde till direktiv i angular


Kod och förklaring uppdaterad

Jag vill att denna direktiv ska inaktiveras eller aktiveras baserat på ett boolean-värde, men oavsett vilket värde (true/false) jag skickar genom variabeln isDraggable, är direktivet aktiverat i båda fallen.

Vad ska förbättras i denna kod?

@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;
}

Svar #1

Lägg märke till @Input-dekoratören. Den lägger till metadata till klassen som gör att direktivets movableObject-egenskap blir tillgänglig för binding.

@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;
}