ng-ckeditor (CKEditor + AngularJS) on visualforce page

visualforce-ckeditor

<apex:page docType="html-5.0" showHeader="false" sidebar="false" standardStylesheets="false" >
  <apex:stylesheet value="//cdn.jsdelivr.net/webjars/bootstrap-sf1/0.1.0-beta.6/css/bootstrap-namespaced.css"/>  
  <apex:stylesheet value="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css"/>

  <link rel="{!URLFOR($Resource.ckeditor, 'src/css/ng-ckeditor.css')}"/>
       
  <apex:includeScript value="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.js"/>
  <apex:includeScript value="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular-sanitize.min.js"/>

  <script src="{!URLFOR($Resource.ckeditor, 'src/libs/ckeditor/ckeditor.js')}"></script>
  <script src="{!URLFOR($Resource.ckeditor, 'src/js/ng-ckeditor.min.js')}"></script>

  <script>
    angular.module("ngApp", ["ngCkeditor"]);
  </script>

<div class="bootstrap" ng-app="ngApp"> 
<div class="container">
<div class="row">
  <div class="col-md-12">
        
    <!-- context-lead -->
    <div class="page-header page-header-compact page-header-transparent context-lead">
      <h1>ckeditor</h1>
    </div><!-- .context-lead -->
    
    <textarea ckeditor="editorOptions" ng-model="modelName"></textarea>
 
  </div><!-- .col-md-12  -->
  </div><!-- .row  -->

</div><!-- .container -->
</div><!-- .bootstrap -->

</apex:page>