angularjs에서 이미지 및 형식을 포함한 summernote 편집기 데이터의 미리보기를 표시하는 방법은 무엇입니까?

Question

내 프로젝트에 미리보기 및 수정 버튼이 있습니다. 편집을 클릭하면 편집자가 숨기기를 표시하고 미리보기합니다. div 또는 무언가에 summernote angularjs 편집기 데이터의 미리보기를 만드는 방법, 편집기 내용에 이미지가 포함될 수 있습니다. 예를 들어 질문이나 답변과 같은 게시물을 만드는 동안 스택 오버플로가 표시 될 수 있습니다. 그것을하는 방법. 아무도 나를 도울 수 있습니까?

<button class="btn btn-primary saveBtn" ng-click="saveContent()">Save</button> 
<summernote id="editor" height="400" ng-model="content" on-image-upload="imageUpload(files)"></summernote> 
<div class="preview" ng-show="item == 'preview'"> 
     {{content}}</div> 

여기에 미리보기가 <p>preview</p> 같은 코드를 보여줍니다. 단락 텍스트처럼 보이게하고 이미지는 미리보기에 이미지와 내용을 표시하기 위해 image.how를 표시하지 않는 일부 형식 (모양과 같은 일부 코드 사용)으로 표시됩니다.

Answer 1

<button class="btn btn-primary saveBtn" ng-click="saveContent()">Save</button> 
    <summernote id="editor" height="400" ng-model="content"></summernote> 
    <div class="preview" ng-show="item == 'preview'"> 
     <div ng-bind-html="content| trusted"></div> 
    </div> 

신뢰 필터는 NG-바인드-HTML = 추가

angular.module('app.filters') 
    .filter('trusted', function($sce){ 
     return function(html){ 
      return $sce.trustAsHtml(html) 
     } 
    }) 

| ngSanitize 모듈과 함께 "표현 필터는"내 문제를 해결