title: JQuery custom dropdown plugin with AngularJS
body: <p>I have seen this amazing drop down [on codrops][1]. But I need to use this in an AngularJS application. How can I use this JQuery plugin in my AngularJS application. I am very new to AngularJS. Is there a better way to do it just in AngularJS without using the pligin?</p>
  
  <p><strong>Edit</strong></p>
  
  <p>I have tried the following directive</p>
  
  <pre><code>heeloApp.directive('dropDown', function() {
      return {
          restrict: 'A',
          link: function(scope, element, attrs) {
              $(element).dropwdown(scope.$eval(attrs.dropDown));
          }
      };
  });
  </code></pre>
  
  <p>and here is the html for my select drop down but it dont seem to work.</p>
  
  <pre><code>&lt;select id="cd-dropdown" class="cd-select" drop-down&gt;
                          &lt;option value="-1" selected&gt;Choose your favorite animal&lt;/option&gt;
                          &lt;option value="1" class="icon-monkey"&gt;Monkey&lt;/option&gt;
                          &lt;option value="2" class="icon-bear"&gt;Bear&lt;/option&gt;
                          &lt;option value="3" class="icon-squirrel"&gt;Squirrel&lt;/option&gt;
                          &lt;option value="4" class="icon-elephant"&gt;Elephant&lt;/option&gt;
                      &lt;/select&gt;
  </code></pre>
  
  <p>The error I can see is </p>
  
  <pre><code>TypeError: Object [object Object] has no method 'dropwdown'
      at link (http://localhost:8000/js/app.js:216:24)
      at nodeLinkFn (http://localhost:8000/ionic-v0.9.26/js/ionic.bundle.js:13214:13)
      at compositeLinkFn (http://localhost:8000/ionic-v0.9.26/js/ionic.bundle.js:12624:15)
      at publicLinkFn (http://localhost:8000/ionic-v0.9.26/js/ionic.bundle.js:12529:30)
      at prelink (http://localhost:8000/ionic-v0.9.26/js/ionic.bundle.js:33274:9)
      at nodeLinkFn (http://localhost:8000/ionic-v0.9.26/js/ionic.bundle.js:13194:13)
      at compositeLinkFn (http://localhost:8000/ionic-v0.9.26/js/ionic.bundle.js:12620:15)
      at publicLinkFn (http://localhost:8000/ionic-v0.9.26/js/ionic.bundle.js:12529:30)
      at link (http://localhost:8000/ionic-v0.9.26/js/angular/angular-route.min.js:7:348)
      at nodeLinkFn (http://localhost:8000/ionic-v0.9.26/js/ionic.bundle.js:13214:13) &lt;select id="cd-dropdown" class="cd-select" drop-down=""&gt; 
  
  
    [1]: http://tympanus.net/codrops/2012/11/29/simple-effects-for-drop-down-lists
  </code></pre>