TinyMCE和带有自动保存插件的Angular Ui TinyMCE

时间:2017-06-27 12:17:09

标签: tinymce-4 angular-ui-tinymce

使用自动保存插件时,angular-ui-tinymce版本0.0.18存在问题。该插件不适用于angular-ui-tinymce。

这已被其他人于2016年10月20日记录到angular-ui github帐户,但没有解决方案。 https://github.com/angular-ui/ui-tinymce/issues/300

以下是使用的代码:

<!DOCTYPE html>
<head>
  <script type="text/javascript" src="bower_components/tinymce/tinymce.js"></script>
  <script type="text/javascript" src="bower_components/angular/angular.js"></script>
  <script type="text/javascript" src="bower_components/angular-ui-tinymce/src/tinymce.js"></script>
  </head>
<body ng-app="myApp">
  <form method="post" ng-controller="TinyMceController">
    <textarea ui-tinymce="tinymceOptions" ng-model="tinymceModel"></textarea>
    <button ng-click="getContent()">Get content</button>
    <button ng-click="setContent()">Set content</button>
  </form>
</body>
<script>
    var myAppModule = angular.module('myApp', ['ui.tinymce']);

    myAppModule.controller('TinyMceController', function($scope) {
    $scope.tinymceModel = '';

    $scope.getContent = function() {
        console.log('Editor content:', $scope.tinymceModel);
    };

    $scope.setContent = function() {
        $scope.tinymceModel = 'Time: ' + (new Date());
    };

    $scope.tinymceOptions = {
        inline: false,
        plugins: 'autosave',
        skin: 'lightgray',
        theme: 'modern',
        menubar: false,
        toolbar1: 'restoredraft storedraft bold italic underline alignleft aligncenter alignright justify bullist numlist outdent indent',
        toolbar2: 'fontselect fontsizeselect',
        autosave_interval: "5s",
        autosave_ask_before_unload: true,
        autosave_retention: "60m"
    };
    });
</script>

0 个答案:

没有答案