2014-10-31 15 views
7

Ich würde summernote mit AngularJS verwenden. Ich habe https://github.com/outsideris/angular-summernote gefunden, aber das funktioniert nicht für mich. Das einzige, was ich erhalte, ist ein FehlerSo verwenden Sie Summernote mit angularjs

Error: undefined is not a function (evaluating 'element.summernote(summernoteConfig)')

ich alle benötigten Dateien wie jquery aufgenommen haben, Bootstrap, summernote usw.

Meine zweite Idee war Sommer Note ohne die Winkel summernote Richtlinie zu verwenden. Aber auch das sollte nicht perfekt funktionieren.

Wenn ich versuche,

$(document).ready(function() { 
    $('.summernote').summernote(); 
}); 

summernote nicht funktioniert, aber wenn ich etw versuchen. wie

$.getScript('//cdnjs.cloudflare.com/ajax/libs/summernote/0.5.1/summernote.min.js',function(){ 
    $('#summernote').summernote(); 
}); 

es funktioniert, aber ich würde meine lokale Kopie summernote verwenden, so dass die zweite nicht das, was ich brauche, ist

Hoffe, dass Sie mein Problem und Dank für jede Hilfe Rico verstanden

Antwort

0

wir haben ähnliches Problem, die einzige Lösung wir sehen, ob es zu wickeln mit einem eigenen Modul (im folgenden es summernoteDemo) wie:

... 
 
      <div class="span1"> 
 
       <div ng-app="summernoteDemo"> 
 
        <summernote id="editor" code="text" ng-model="item.description"></summernote> 
 
        <br> 
 
        <textarea type="text" ng-model="item.description" style="width:100%;"></textarea></br> 
 
       </div>

Aber wir haben Probleme, es an mehr als einem Ort/Instanz erscheinen zu lassen. Vielleicht kannst du es versuchen und uns wissen lassen.

+0

Ist für mich nicht funktioniert :(, gleiche Fehler wie vorher. Ist es möglich, dass summernote Arbeit nur mit einer bestimmten Version von Bootstrap, jquery usw.? – BlackSalt

10

Ok Jungs, ich habe das Problem gefunden, für alle mit dem gleichen Problem ein sehr dummer Fehler es ist;)

Das Problem war, die ich die Haupt angular.min.js Datei, bevor jQuery eine Bootstrap umfassen. Jetzt schließe ich zuerst jQuery, dann Bootstrap und dann AngularJS ein und es funktioniert perfekt.

<link rel="stylesheet" type="text/css" href="bootstrap.css" /> 
<link rel="stylesheet" type="text/css" href="summernote.css" /> 
<script src="jquery-2.1.1.min.js"></script> 
<script src="bootstrap.min.js"></script> 
<script src="summernote.min.js"></script> 
<script src="angular.min.js"></script> 
<script src="angular-summernote.min.js"></script> 

In dieser Reihenfolge funktioniert es perfekt für mich.

Ein kurzer Tipp, wenn Sie auch ein Problem mit der Größe der Schaltfläche haben, ist nur zu tun, <!DOCTYPE html> in Ihrem Haupt-HTML-Datei enthalten.

Rico