Question

我正在为每个选定的用户创建多个tinymce编辑器。如果用户数量较少（低于10），则可以正确创建编辑器。如果用户限制超过10，则编辑器将仅应用于少数文本区域，而不适用于少数文本区域。

请参考上图。 我的观点是：

<div ng-repeat="selnominee in pepsicoNomination.selectedNomineesforContribution track by $index">
<textarea class="contri_txtarea"
                                      ng-model="selnominee.NomineeDetails.Contribution" ui-tinymce="tinymceNominee.options" rows="13" cols="80" required></textarea>
</div>

基于＆＃34; pepsicoNomination.selectedNomineesfor贡献＆＃34;的长度，将创建文本区域的数量，并且需要将编辑器应用于这些文本区域。

我的脚本是：

$scope.tinymceNominee = {
            cmtsCharLength: 0,
            options: {
                height: 175,
                theme: 'modern',
                plugins: [
                    "advlist autolink lists link image  hr anchor charcount  autoresize"
                ],
                toolbar1: "bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link",
                menubar: false,
                browser_spellcheck: true,
                gecko_spellcheck: true,
                content_css: [
                    '//fonts.googleapis.com/css?family=Lato:300,300i,400,400i',
                    '//www.tinymce.com/css/codepen.min.css'
                ],
                resize: true,
                elementpath: false,
                autoresize_min_height: 175,
                autoresize_max_height: 600,
                setup: function (ed) {

                   ed.on('resizeeditor', function (e) {
                        $('.mce-tinymce').width("100%");
                    });

                   ed.on('keydown', function (e) {
                        var allowedKeys = [8, 35, 36, 37, 38, 39, 40, 45, 46];
                        if (allowedKeys.indexOf(e.keyCode) != -1) return true;

                       var txtLength = CountCharacters(ed.id);
                        if (txtLength >= $scope.pepsicoNomination.Band.ContributionCharCount) {
                            e.preventDefault();
                            e.stopPropagation();
                            return false;
                        }
                        $scope.cmtsCharLength = txtLength;
                        return true;
                    });

                   ed.on('keyup', function (e) {
                        var count = CountCharacters(ed.id);
                        $scope.cmtsCharLength = count;
                    });
                },
                mode: 'exact'
            }
        };

Answer 1

某些版本的TinyMCE存在错误。指令生成的ID有时具有相同的名称。打开你的ui-tinymce.js文件并更改以下行：

attrs.$set('id', ID_ATTR + '-' + (new Date().valueOf()));

为：

attrs.$set('id', ID_ATTR + '-' + (new Date().getTime().valueOf()));

这将确保所有ID都是唯一的。

动态创建多个ui tinymce编辑器angularjs的问题

1 个答案: