come usare il plugin jQuery (semantic-ui) nella direttiva angularJS?

Question

Io uso semantico-ui nel mio progetto, il pulgin è casella
qualcuno dire se l'uso jQ plug-in, è necessario utilizzare nella direttiva angolare
ma non funziona

la casella di impostazione semantica-ui nel documento API semantico-ui, è necessario impostare questo per init casella

$('.ui.checkbox').checkbox(); 

provo a cambiare a angolare in questo modo:

app.html

<div class="ui animate list"> 
    <div class="item ui toggle checkbox" todo-checkbox ng-repeat="item in day track by $index"> 
    <input type="checkbox"> 
    <label ng-bind="item.content"></label> 
    </div> 
</div> 

e questa è la direttiva in angularjs file di

todoApp.directive('todoCheckbox', function() { 
    return { 
    restrict: 'A', 
    link: function(scope, elem, attrs) { 
     $(elem).checkbox(); 
    } 
    }; 
}); 

ma non funziona nel mio progetto. Perché?

Answer 1

Sei vicino. elem è l'elemento della direttiva. In questo caso è

<div class="item ui toggle checkbox" todo-checkbox ng-repeat="item in day track by $index"> 
    <input type="checkbox"> 
    <label ng-bind="item.content"></label> 
</div> 

Ora, se usiamo find per aiutarci a individuare il campo di inserimento all'interno del elem, allora possiamo selezionare il campo di input ed eseguire il metodo checkbox.

todoApp.directive('todoCheckbox', function() { 
    return { 
    restrict: 'A', 
    link: function(scope, elem, attrs) { 
     angular.forEach(elem.find("input"), function(inputField) { 
     inputField.checkbox(); 
     } 
    } 
    }; 
}); 

Answer 2

Un po 'in ritardo alla festa, ma si dovrebbe essere in grado di spostare solo il todo-checkbox al input tag (stesso con gli attributi specifici ui semantica)

Answer 3

Prova

angular.element(elem).checkbox(); 

invece di

$(elem).checkbox();