Angular 2: Wie wird die Attributrichtlinie bedingt angewendet?

Question

Ich benutze Drag & Drop über ng2-dragula. Die Drag & Drop-Funktionalität & wird auf diese Weise angewendet:

<div class='container' [dragula]='"first-bag"'> 
    <div>item 1</div> 
    <div>item 2</div> 
</div> 

Wenn ich Winkel verstehen 2 die Art und Weise richtig, wie [dragula]='"first-bag"' meiner div Attribute Directive in Angular genannt wird angebracht 2.

Jetzt habe ich eine Variable in meiner Komponente enableDragNDrop:boolean genannt. Wie kann ich diese Variable verwenden, um [dragula]='"first-bag"' an meinem div nur anzufügen, wenn enableDragNDrop == true?

Wenn enableDragNDrop == false, ich möchte dies:

<div class='container'><!-- no dragula attribute directive, no dragndrop --> 
    <div>item 1</div> 
    <div>item 2</div> 
</div> 

Answer 1

Es gibt keine Möglichkeit, dynamisch hinzufügen/entfernen Richtlinien durch das Hinzufügen/Entfernen einen Selektor. Der Selektor muss statischer HTML-Code sein, damit die Anweisung angewendet wird. Sie können Funktionen von Dragula nur zum Aktivieren/Deaktivieren verwenden, wenn eine solche Konfigurationsoption zur Verfügung steht.

Ich habe ng2-dragula oder dragula nicht verwendet, aber ich denke, man einen dragModel zuweisen können und es auf diese Weise

<div class='container' dragula [dragulaModel]="dragulaModel"> 

dragulaModel = {start: function() {}}; 

und wenn Sie es aktivieren möchten so konfigurieren, dass ein Modell zuordnen, die doesn 't disable start

enableDrag() { 
    this.dragulaModel = {}; 
} 

Nicht getestet, nur ein bisschen durch die Quelle überflogen.