Ng-tinymce-typeahead

Angular directive tinymce autocomplete menu for links or image quick insertion control.

Demo

Here we are, use keyboard for menu choices.

Simple editor

Content preview

Code

  <div>
    <textarea id="tinymce" ui-tinymce='{plugins: ["link image"], height : 500}' ng-model="tinymce" hotkey="{esc: close, 'ctrl+left': mute}" class="mousetrap"><textarea>
    <div ui-tinymce-linker-menu menu="menu"></div>                          
  </div>
  
  <script>
    function ctrl($scope) {
      // what will look a menu
      // look into my service to see how feel typeahead content
      $scope.menu = [
          { id: '1', label:'Music', icon:'glyphicon-music', children: [
              {id:'1-1', label:'Links', icon: 'glyphicon-link', children: [
                { id: '1-1-1', label:'Rap', type: 'link' },
                { id: '1-1-2', label:'Rock', type: 'link' }
              ]},
              {id:'1-2', label:'Images', icon: 'glyphicon-picture', children: [
                { id: '1-2-1', label:'Rap', type: 'image' },
                { id: '1-2-2', label:'Rock', type: 'image' }
              ]}
      ]}];
    }   
  </script>
      
</body>
</html>


Donate