複数のUIエディタのanglejsを動的に作成する際の問題

Question

私は選択された各ユーザに対して複数のtinymceエディタを作成しています。 ユーザーの数が少ない場合（10未満）、エディタが正しく作成されました。 ユーザーが10を超えて制限すると、エディタは少数のテキスト領域にのみ適用され、少数のテキスト領域には適用されません。

Please refer this image for my issue.

上の画像を参照してください。 私の見解は次のとおりです。「pepsicoNomination.selectedNomineesforContribution」の長さに基づいて

<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> 

、テキスト領域の数が作成され、エディタは、これらのテキスト領域に適用する必要があります。

私のスクリプトは次のとおりです。は

$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が一意であることを確認します。