在Angular Fullstack中设置TinyMCE

setting up TinyMCE in Angular-Fullstack

本文关键字：设置 TinyMCE Fullstack Angular      更新时间：2023-09-26

所以我正试图以正常方式在Angular-Fullstack项目中设置TinyMCE。

像这样：

<script type="text/javascript" src="tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
    tinymce.init({
        selector: "textarea"
    });
</script>
<div>
    <h1>
        New chapter
    </h1>
    <form class="form" name="form" ng-submit="save(form)" novalidate>
        <div class="form-group">
            <label class="sr-only" for="title">Title</label>
            <input class="form-control" name="title" type="text" placeholder="enter title here" required ng-model="entry.title" />
        </div>
        <div class="form-group">
            <select required ng-model="entry.language">
                <option disabled>Choose language</option>
                <option ng-repeat="e in languages" value="{{e._id}}">{{e.name}}</option>
            </select>
        </div>
        <div class="form-group">
            <label class="sr-only" for="content">Content</label>
            <textarea ng-model="entry.content" id="textarea" name="content" ></textarea>
        </div>
        <button type="submit" class="btn btn-success" id="save-btn"><span class="glyphicon glyphicon-ok"></span> Save</button>
    </form>
</div>
<hr>
<div>
    <h1>{{entry.title}}</h1>
    <br/>
    <span ng-bind-html-unsafe="entry.content"></span>
</div>

这根本不会改变我的文本区域。Angular-fullstack中是否有什么东西阻止您使用这样的普通插件？

看起来您正在使用ui-tinymce。您不需要tinymce.init:

JS:

var app = angular.module('app', ['ui.tinymce']);
app.controller('myController', function($scope) {
    $scope.tinymceOptions = {};
    $scope.entry = {};
});

HTML:

<textarea ui-tinymce="tinymceOptions" ng-model="entry.content"></textarea>

http://plnkr.co/edit/4AzSZp3xD3lzJwzrOVk0?p=preview

相关文章：