Как интегрировать Tinymce с AngularJS - PullRequest
0 голосов
/ 11 июля 2019

Вот как я сделал кодирование.

Пожалуйста, мне нужна кое-какая помощь для этого.

Ниже приведен код HTML и Javascript

<html>
[<head>][2]
<script type="text/javascript" src="//cdn.tinymce.com/4/tinymce.min.js"> 
</script>
<script type="text/javascript" 
src='https://cdnjs.cloudflare.com/ajax/libs/angular-ui- 
tinymce/0.0.19/tinymce.js'></script>
<!-- AngularUI TinyMCE -->

</head>
<body ng-app="myApp" ng-controller="myController">
<form>
<textarea ui-tinymce="tinymceOptions" class = "text1" id="mytextarea" 
>Hello, World!</textarea>
</form>
</body>
</html> 

Файл Javascript:

var myAppModule = angular.module('myApp', ['ui.tinymce']);
myAppModule.controller('myController', function($scope) {
tinyMCE.init({
selector: "text1"
})

$scope.tinymceOptions = {
plugins: 'link image code',
toolbar: 'undo redo | bold italic | alignleft aligncenter alignright | 
code'
};
})

Это то, что я получаю после запуска кода

1 Ответ

0 голосов
/ 11 июля 2019

Пожалуйста, рассмотрите следующий код, который должен работать:

var myAppModule = angular.module('myApp', ['ui.tinymce']);
myAppModule.controller('myController', function ($scope) {
    tinyMCE.init({
        selector: "text1"
    })

    $scope.tinymceOptions = {
        plugins: 'link image code',
        toolbar: 'undo redo | bold italic | alignleft aligncenter alignright | code '
    };

    $scope.model= "text";
})
<html>
<head>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.8/angular.js"></script>  
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/tinymce/4.9.5/tinymce.min.js"></script>
  <script type="text/javascript" src='https://cdnjs.cloudflare.com/ajax/libs/angular-ui-tinymce/0.0.19/tinymce.js'></script>
  <!-- AngularUI TinyMCE -->
  <script type="text/javascript" src="index.js"></script>
</head>

<body ng-app="myApp" ng-controller="myController">
  <form>
    <textarea ui-tinymce="tinymceOptions" class="text1" id="mytextarea" ng-model="model">Hello, World!</textarea>
  </form>
</body>

</html>

Изменения по сравнению с вашим кодом:

  1. В HTML я вставил ng-модель, так как это требуется директивой tinymce,Я также инициализировал значение в коде JavaScript как $scope.model= "text";
  2. . В голове я проверил ссылки и убедился, что сначала загружены AngularJs (не минимизированы, поэтому можно увидеть ошибки, что имеет смысл), затембазовое tinymce, затем angular-ui-tinymce и, наконец, мой код.Я также проверил, что все ссылки не мертвы.

ps Сниппет не работает должным образом.Но вы можете скопировать код из него и попробовать локально.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...