각도 데이터에서 원시 html 또는 표시 방법

각도 데이터에서 원시 html 또는 표시 방법

표시 방법 문자열이 아닌 공간입니다.거기에 있습니까.raw나뭇가지처럼 필터링을 하나요?

<div>{{item}}</div>

$scope.item = '&nbsp;';

하지만 결과는 탈출했다. 이게 필요한 이유는' '높이가 0입니다.

ngBindHtml을 사용하면 쉽게 할 수 있습니다.

Angular 버전이 1.2.x보다 큰 경우:

사용하다ng-bind-html

작업 데모

html

<div ng-app='myApp' ng-controller="Controller">
   <div ng-bind-html="item"></div>
</div>

대본

var app = angular.module('myApp', ['ngSanitize']);
app.controller('Controller', function ($scope, $sce) {
   $scope.item = 'What Is Your Name?';
});

---

Angular 1.0.x 버전의 경우:

작업 데모

사용하다ng-bind-html-unsafe

html

<div ng-app='myApp' ng-controller="Controller">
   <div ng-bind-html-unsafe="item"></div>
</div>

대본

var app = angular.module('myApp', []);
app.controller('Controller', function ($scope) {
   $scope.item = 'What Is Your Name?';
});

Angular 1.3.x 버전의 경우:

를 사용합니다.$sce특정 컨텍스트(이 경우는 HTML)에서 사용해도 안전한 스트링을 마크하는 서비스입니다.
매뉴얼은 이쪽

HTML 코드:

<div ng-app='myApp' ng-controller="Controller">
   <div ng-bind-html="item"></div>
</div>

JS 코드(컨트롤러):

var app = angular.module('myApp', []);
app.controller('Controller', function ($scope, $sce) {
   $scope.item = $sce.trustAsHtml('<span>Some HTML code</span>');
});

ngBindHtml 사용 시도

<div data-ng-bind-html="item"></div>

필터도 작성할 수 있습니다.

필터

app.filter("trustHtmlContent", ['$sce', $sce => htmlCode => $sce.trustAsHtml(htmlCode)]);

사용.

<ANY ng-bind-html="value | trustHtmlContent"></ANY>

src: Angular 1.2+에서 $sce.trustAsHtml(string)을 사용하여 ng-bind-html-unsafe를 복제하려면 어떻게 해야 합니까?

문자열에서 &nbsp의 ASCII 코드를 사용할 수 있습니다.Alt-255.

이렇게 하면 &nbsp로 올바르게 렌더링됩니다.

언급URL : https://stackoverflow.com/questions/24657386/how-to-display-nbsp-or-any-raw-html-in-angular-data