angularjs - example - ionic angular is not defined

por qué jquery-elegido no funciona dentro de pestañas en angular-ui

Question

<tabset  class="ui-tab">
    <tab heading="General Details">
      <select class="chosen chzn-done chosen-select">
          <option value=""></option>
          <option value="1">contains</option>
          <option value="2">does not contain</option>
          <option value="3">is equal to</option>
      </select>
    </tab>
</tabset>


 jQuery(document).ready(function () {
    jQuery(".chosen").chosen({
        no_results_text: "Oops, nothing found!",
        allow_single_deselect: true,
        width: "20%"
    });
});

Este es el código que he probado. Aquí, el menú desplegable elegido no funciona pero funciona correctamente en el lado <tabset> . ¿Cómo debería resolver esto?

Answer 1

La forma angular es crear una directiva para los complementos jQuery.

He creado uno simple para el jquery elegido que usted mencionó. Aquí está el plunker :

var app = angular.module(''app'', [''ui.bootstrap'']);

app.directive(''chosen'', function(){
  return {
    link: function(scope, element){
      element.chosen({
        no_results_text: "Oops, nothing found!",
        allow_single_deselect: true,
        width: "20%"
      });
    }
  };
});

EDITAR : Ya hay una biblioteca para integrar jquery-elegido a angular : angular-elegido