angular+ckeditor最後上傳的最後一張圖片不會被添加（bug）

作法一：

　　angularJs+ckeditor

1、頁面

　　<textarea ckeditor required name="topicContent" ng-model="topic.body" rows="20" class="form-control col-md-8 ecp-post-content" name="content"></textarea>

2、指令

app.directive('ckeditor', function() {
return {
require : '?ngModel',
link : function(scope, element, attrs, ngModel) {
var ckeditor = CKEDITOR.replace(element[0], {

});
if (!ngModel) {
return;
}
ckeditor.on('instanceReady', function() {
ckeditor.setData(ngModel.$viewValue);
});
ckeditor.on('pasteState', function() {
scope.$apply(function() {
ngModel.$setViewValue(ckeditor.getData());
});
});
ngModel.$render = function(value) {
ckeditor.setData(ngModel.$viewValue);
};
}
};
});

這樣就可使用了，可是這樣有個bug,若是上傳圖片以後，後面不加而後字符那張圖片的標籤就不會被保存，由於圖片上傳成功後，圖片的標籤是ckeditor添加的，並非經過咱們的鍵盤或鼠標去操做的，

因此這樣ng-model就不會去執行髒檢查，若是咱們的圖片是複製粘貼到上面的，就會被檢查到，ps:這裏並非真的指最後一張圖片，而是指ckeditor自動添加標籤（好比圖片上傳成功以後它會自動添加該圖片的img標籤）以後，若是咱們沒有輸入，則ng-model（ng-model是自動執行髒檢查的!）的髒檢查是檢查不出來的（這裏的原來具體還不清楚）

因此我最後換成了作法二，頁面使用的邏輯所有不變，只是文本編輯框不是經過ng-model去取值了，而是根據官網上的根據js/jQuery去取值

作法2、

1、頁面

        <textarea required name="topicContent" ng-model="topic.body" rows="20" class="ckeditor form-control col-md-8 ecp-post-content" name="content"></textarea>

<script>
      CKEDITOR.replace("content");//這裏要和name屬性值一致
</script>

2、js取值

      ajax提交前（angularJs就是$http提交以前）       

 　 //須要手動更新CKEDITOR字段
     for ( instance in CKEDITOR.instances ){ 
       CKEDITOR.instances[instance].updateElement(); 
     }

     而後經過

     $("textarea[name='content']").val();來取值便可！！！

 

  

 用方法二的方法，就解決掉了ng-model沒法髒檢查ckeditor自動添加標籤的bug了（雖然是個笨方法，可是問題仍是解決了！）