TinyMCE in Angular-Fehler mit cant Zugriff Körper und $ sce

Ich versuche, Tiny MCE in Winkel arbeiten und weniger als stellaren Erfolg damit zu bekommen.

Zur Zeit kann ich nicht nach diesem Fehler erhalten:

Unable to get property 'body' of undefined or null reference

Ich habe sogar versucht, nur eine grundlegende Geige mit ihm laufen zu bekommen aber das auch nicht weiter. http://jsfiddle.net/m0z0n6dL/

Soweit ich alle verstehen, was Sie brauchen ist die tinymce-Winkel Skript und dann Textbox dekorieren mit <textarea ui-tinymce="tinymceOptions" ng-model="text" type="text"><textarea>

und es in dem Modul

var myApp = angular.module('myApp', ['ui.tinymce']);

Aber das scheitert auf einschließen:

Unknown provider $sceProvider <- $sce <- uiTinymceDirective

Wenn jemand mir ein einfaches Beispiel zeigen konnte CDNs für Winkel- und tinymce Abhängigkeiten verwenden würde ich wirklich hap sein py.

Quelle

2016-07-15 JensB

JensB, hat meine Antwort funktioniert? – developer033

@ developer033 Das TinyMCE-Angular-Plugin scheint zu viel Aufwand für das Ergebnis zu sein, also ging ich stattdessen mit diesem https://github.com/fraywing/textAngular. Für einfaches Text-Styling ist es ausreichend. – JensB

@ developer033 Auch scheint TinyMCE-Angular nicht wie in ng-repeats zu sein und sich mit ng-show und ng-if's auseinanderzusetzen. – JensB

Nun, es scheint, dass Sie MUST Instanziieren Sie Ihr Modul als ui.tinymce, sonst funktioniert es nicht.

Hier ist ein Beispiel :

angular.module('ui.tinymce') 
 
    .controller('mainCtrl', function($scope, $sce) { 
 
    $scope.updateHtml = function() { 
 
     $scope.tinymceHtml = $sce.trustAsHtml(ctrl.tinymce); 
 
    }; 
 
    });

<!DOCTYPE html> 
 
<html ng-app="ui.tinymce"> 
 

 
<head> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/tinymce/4.3.2/tinymce.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular.min.js"></script> 
 
    <script src="https://cdn.rawgit.com/angular-ui/ui-tinymce/master/src/tinymce.js"></script> 
 
</head> 
 
<body ng-controller="mainCtrl"> 
 
    <form method="post"> 
 
    <textarea ui-tinymce 
 
     ng-model="tinymce" 
 
     ng-change="updateHtml()"></textarea> 
 
    </form> 
 
    <div ng-bind-html="tinymceHtml"></div> 
 
</body> 
 

 
</html>

Hinweis: Das obige Beispiel nicht gut kompilieren, weil die stacksnippets ist die url von tinymce blockiert.

Sie können die vollständige Demo here ohne Fehler sehen.

Quelle

2016-07-15 16:40:36 developer033

Wirklich nervig, um das Modul nach TMCE zu benennen, was ist, wenn andere Module die gleiche Anforderung stellen. – JensB

Ja .. es ist wirklich schlimm, aber hat es mit meinem Beispiel funktioniert, oder? – developer033

@JensB, können Sie es als richtig überprüfen? – developer033

TinyMCE in Angular-Fehler mit cant Zugriff Körper und $ sce

Antwort

Verwandte Themen