I want to bind a text box to an angularjs variable and have it output rendered html in a separate div.

我有：

<div ng-app="myapp">
<form:textarea ng-model="ddata" id="displayData" path="displayData"/>

<div ng-bind-html-unsafe='ddata'>
{{ddata}}
</div></div>

和所有我看到的是{{DDATA}}

and all I see is "{{ddata}}"

我想在像键入：    B粗体文字/ B>

I would like to type in something like: 'b bold text /b>

和有它呈现粗体文本。

如果有人可以张贴小提琴，我会AP preciate它极大地。

If someone could post a fiddle, I would appreciate it greatly.

推荐答案

版本，在角＆LT工程; 1.2

Version that works in angular < 1.2

http://jsfiddle.net/AQWAR/

在HTML

<div ng-app="myapp">
<form>
    <input type="text" ng-model="ddata"/>
</form>
{{ddata}}

<div ng-bind-html-unsafe='ddata'>
</div>
</div>

在JS

angular.module("myapp", []);

在角Works版本> 1.2（含1.2.1专门测试）

Version that works in Angular > 1.2 (specifically tested with 1.2.1)

http://jsfiddle.net/AQWAR/1/

HTML

<div ng-app="myapp" ng-controller="MyCtrl">
<form>
    <input type="text" ng-model="ddata.someString"/>
</form>
{{ddata}}

<div ng-bind-html='ddata.trustedVersion'>
</div>
</div>

在JS

angular.module("myapp", []).controller("MyCtrl", ["$scope","$sce", function($scope, $sce){
    $scope.ddata = {someString:"", trustedVersion:""}
    $scope.$watch("ddata.someString", function(newVal){
        $scope.ddata.trustedVersion = $sce.trustAsHtml(newVal);
    },true);
}]);

对于一些更安全的选择退房的sanitize $ $和SCE

For some safer options check out $sanitize and $sce

http://docs.angularjs.org/api/ngSanitize.$sanitize

http://docs.angularjs.org/api/ng.$sce