1

モーダル ダイアログ ボックスで次のコードを使用しています。

    <input data-ng-model="modal.formData.text" type="text">
    <textarea
        data-ui-tinymce
        data-ng-disabled="modal.action=='delete'"
        data-ng-model="modal.formData.text"
        id="inputText"
        required></textarea>

ユーザーが行のテーブル内のグリッド編集ボタンをクリックすると、ダイアログ ボックスが開きます。

ユーザーが初めて (ハード リフレッシュの後) 編集をクリックすると、<input>ボックスと tinymce ウィンドウが表示されます。その後、編集をクリックするとダイアログが開きますが、<input>ボックスのみが入力されます。

4

1 に答える 1

1

私はこの問題を解決するために過去 3 日間を費やし、最終的に tinymce の angularjs ディレクティブを捨てました。ゴールデンタイムの準備が整っているとは思えません。私の回避策は、これを Angular-Bootstrap モーダル ダイアログ ボックスのコントローラーに配置することでした。

    setTimeout(function() {   //wait for the dialog to be open
        tinymce.init({
            selector: "#editorID",
            setup:function(ed) {
                ed.on("init", function(){
                    $scope.editor = ed; //save a reference to the editor
                    //manually put your model into the editor:
                    $scope.editor.setContent($scope.model.textForTheEditor); 
                });
            }   
        });
    }, 333); //a third of a second is more time than you need, but it works

ダイアログが閉じたら、エディターの内容でモデルを更新します。

   $scope.model.textForTheEditor = $scope.editor.getContent();

あなたが望んでいた解決策ではなく、「コントローラーにDOMがない」というパラダイム全体に違反していることはわかっていますが、TinyMCEをAnguler/Twitter Bootstrapダイアログボックスで繰り返し動作させる唯一の方法のようです.

私も Angularjs ディレクティブを使用したより良いソリューションが大好きです! お役に立てれば。

于 2013-09-09T19:37:08.017 に答える