UI-tinimcyのテキストエリアが

Question

を必要と私はチェックするui-tinymcetextareaに検証を追加したい、次のエラーメッセージ

<div ng-messages="SomeForm.questionBody.$error"> 
<label 
for="QuestionBody" 
class="error-text" 
ng-message="required"> 
Error 
</label> 
</div> 

、ユーザーがEnterをクリックすると、requiredがないことを問題とボディ空

<form id="SomeForm"> 
<textarea 
id="QuestionBody" 
name="questionBody" 
ng-model="vm.body" 
ui-tinymce="vm.tinymceOptions" 
required> 
</textarea> 

ですui-tinymceには<p>&nbsp</p>のようなものが追加されています。

まず、私は設定に追加してみてください、プロパティ

valid_elements : '-#p' 

をvalid_elementsが、それはすべての空pの要素を削除します。

forced_root_blockも、私はテキストエリアの文字が含まれている場合にのみ有効なフォームを作る検証を追加することができますどのように

を助けていないのですか？

ことが可能jQueryの

Answer 1

せずに、あなたが見ている問題は、検証などの標準ディレクティブは単純な（空の）HTMLサンプルので、文字を数えることである場合：

<p></p> 

が実際に7つの文字として表示されるでしょう実際には「目に見える」内容はありません。

ここで最も簡単な解決策は、カスタムディレクティブを作成し、jQueryの.text（）関数をHTMLに対して使用することです。これにより、すべてのHTMLタグが削除され、実際のテキスト文字の数がエディタに表示されます。

仕事はこのようなものになるだろうだろうディレクティブのコードの部分：私はあなたがモデルデータをつかむことを可能にするカスタム属性ディレクティブを作成したいと考えている

var jStrippedString = jQuery(modelValue).text().trim(); 
return (maxlength < 0) || 
     ngModelCtrl.$isEmpty(jStrippedString) || 
     (jStrippedString.length <= maxlength); 

編集者のために、この検証を自分で実行してください。