防止Angular.js剥离出json文件的html格式

Question

我正在尝试使用Angular 1遍历json文件中的数据。数据之一包含HTML字段集和表格数据。 Angular正在剥离这一点。我怎样才能防止这一点？

这是我使用的应用程序的代码：

var app = angular.module('myApp', ['ngSanitize']); 

app.controller('crisisCtrl', function($scope, $http) { 
    $http.get("data.php").then(function(response) { 
     $scope.mkyData = response.data.records; 
    }); 
}); 

JSON文件（data.php）：

{ 
    "records": [ 
    { 

     "Card": "3", 
     "Title": "Blah", 
     "Content": "<fieldset class=\"table bt-0\"><thead><tr><th>Name</th><th>Role</th><th>Number</th></tr></thead><tbody><tr><td>Bill</td><td> Director</td><td><a href=\"tel:000\">304 304-3042</a></td></tr><tr><td>Mary</td><td>Technical</td><td><a href=\"tel:000\">304 304-3042</a></td></tr><tr><td>Hannah</td><td>Engineer</td><td><a href=\"tel:000\">120 104-4042</a></td></tr></tbody></fielset>" 
     } 
     ] 
    } 

而我的HTML文件中：

<div class="container" ng-app="myApp" ng-controller="crisisCtrl"> 
    <div class="card" ng-repeat="x in myData"> 
     <div class="card-block" ng-bind-html="x.Content"></div> 
    </div> 
</div> 

这是一个调整小提琴：

http://jsfiddle.net/deCcG/2/

Answer 1

的<fieldset class=\"table bt-0\">是什么原因造成的问题，如果您添加表元素的角度，然后将能够阅读HTML与正确的元件和显示器被正确格式正确

var app = angular.module('myApp', ['ngSanitize']); 

app.controller('myCtrl', function($scope) { 
    $scope.page = { 
    "title": "Getting Started", 
    "content": "<fieldset class=\"table bt-0\"><table><thead><tr><th>Name </th><th>Role</th><th>Number</th></tr></thead><tbody><tr><td>Bill Williams</td><td>Widget Director</td><td><a href=\"tel:000\">+1 304 304-3042</a></td></tr><tr><td>Mary Barnhill</td><td>Technical</td><td><a href=\"tel:000\">+44 304 304-3042</a></td></tr><tr><td>Hannah Kwak</td><td>Engineer</td><td><a href=\"tel:000\">+44 120 104-4042</a></td></tr></tbody></table></fieldset>" 
    } 
}) 

Answer 2

thead和tbody应用于table。您的浏览器可能会接受它，但Angular不支持。

尝试只需更新您的$scope.page.content有：

"content":"<fieldset class=\"table bt-0\"><table><thead><tr><th>Name</th><th>Role</th><th>Number</th></tr></thead><tbody><tr><td>Bill Williams</td><td>Widget Director</td><td><a href=\"tel:000\">+1 304 304-3042</a></td></tr><tr><td>Mary Barnhill</td><td>Technical</td><td><a href=\"tel:000\">+44 304 304-3042</a></td></tr><tr><td>Hannah Kwak</td><td>Engineer</td><td><a href=\"tel:000\">+44 120 104-4042</a></td></tr></tbody></table></fieldset>" 

Working Fiddle here。

---

此外，你错过拼写收盘</fieldset>。