1

text-angular の WYSIWYG エディターを使用するようにバックエンド CMS を変更することにしました。コンテンツはデータベースから問題なく取得され、問題なくレンダリングされますが、HTML ソースを表示しようとすると、テキストが一瞬存在し、その後消えてしまいます。ta-unsafe-sanitizer="true" でサニタイズをオフにしました。奇妙なことに、消化を行うAngularコードを手動でステップ実行すると、最終的にテキストがレンダリングされ、画面に残ります。ブレークポイントなしで実行すると、テキストがクリアされます。

サニタイズなのか、Angular 内で何らかの競合状態なのかはわかりません。他の誰かがこれに遭遇しますか？

意見

<div text-angular ta-toolbar="[['h1','h2','h3'],['bold','italics','underline'],['ul','ol'],['outdent','indent'],['html'],['insertImage']]" ng-model="updatePageTranslation.Content" ta-unsafe-sanitizer="true"></div>

コントローラ

$scope.updatePageTranslation.Content = 'large html portion here';

フォームのスコープは次のように設定されます。

<div class="widget" ng-controller="PageController">

すべてが正常にロードされ、フォームの他のフィールドに値が正しく表示されます。コンテンツの最初のレンダリングは正しいです。空白になるのは、HTML ビューに切り替えたときだけです。Html をもう一度クリックすると、正しいビジュアル ビューに戻ります。しかし、保存すると、サーバーに送信される値は空白になります。

値をコピーして textangular.com サイトのデモ テキスト ボックスに貼り付けても、同じ問題が発生します。

4

2 に答える 2

0

前述のように、これはパーサーが空白と改行を正しく処理するのに苦労しているためと思われます。

taBind.js の textAngular ソースを見ると、バインドされた値にスペースや改行などが含まれている場合、_taBlankTestサービスは true を返すように見えます。これにより、モデルが未定義に設定されます。

その状況を回避するために、私は次のものに置き換えました。

angular.module('textAngular.taBind', ['textAngular.factories', 'textAngular.DOM'])
.service('_taBlankTest', [function(){
    var INLINETAGS_NONBLANK = /<(a|abbr|acronym|bdi|bdo|big|cite|code|del|dfn|img|ins|kbd|label|map|mark|q|ruby|rp|rt|s|samp|time|tt|var)[^>]*(>|$)/i;
    return function(_defaultTest){
        return function(_blankVal){
            if(!_blankVal) return true;
            var _matchVal = _blankVal.replace(/(  |\t|\n)/gm, '');

        // find first non-tag match - ie start of string or after tag that is not whitespace
        var _firstMatch = /(^[^<]|>)[^<]/i.exec(_matchVal);
        var _firstTagIndex;
        if(!_firstMatch){
            // find the end of the first tag removing all the
            // Don't do a global replace as that would be waaayy too long, just replace the first 4 occurences should be enough
            _matchVal = _matchVal.toString().replace(/="[^"]*"/i, '').replace(/="[^"]*"/i, '').replace(/="[^"]*"/i, '').replace(/="[^"]*"/i, '');
            _firstTagIndex = _matchVal.indexOf('>');
        }else{
            _firstTagIndex = _firstMatch.index;
        }
        _matchVal = _matchVal.trim().substring(_firstTagIndex, _firstTagIndex + 100);
        // check for no tags entry
        if(/^[^<>]+$/i.test(_matchVal)) return false;
        // this regex is to match any number of whitespace only between two tags
        if (_matchVal.length === 0 || _matchVal === _defaultTest || /^>(\s|&nbsp;|\n|\t)*<\/[^>]+>$/ig.test(_matchVal)) return true;
        // this regex tests if there is a tag followed by some optional whitespace and some text after that
        else if (/>\s*[^\s<]/i.test(_matchVal) || INLINETAGS_NONBLANK.test(_matchVal)) return false;
        else return true;
    };
};
}])

うまくいけば、それが誰かを助けるかもしれません！

于 2016-06-16T06:26:08.813 に答える