angular ckeditor 編輯文字

先下載ckeditor

並且在index 中引用

  <script  src="lib/ckeditor/ckeditor.js"></script>

html 中代碼：

  <form action="">
      <textarea ckeditor ng-model="dataAll122.Name" class="form-control" name="content"></textarea>

    </form>

    <button ng-click="clickAlert()">獲得數據</button>

controller中代碼：

  $scope.dataAll122 = {
      'Name': '',//
    };

 $scope.removeHTMLTag =  function (str) {
      str = str.replace(/<\/?[^>]*>/g,''); //去除HTML tag
      str = str.replace(/[ | ]*\n/g,'\n'); //去除行尾空白
      //str = str.replace(/\n[\s| | ]*\r/g,'\n'); //去除多餘空行
      str=str.replace(/ /ig,'');//去掉 
      str=str.replace(/\s/g,''); //將空格去掉
      return str;
    }

//獲取純文本
    $scope.clickAlert = function(){
      console.log("-------");
      console.log($scope.dataAll122.Name);
     $scope.xudesong =  $scope.dataAll122.Name,

       $scope.xudesong= $scope.removeHTMLTag( $scope.dataAll122.Name);
      console.log( $scope.xudesong);
    }

directive 中的代碼

.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);
      };
    }
  };
});