angular相容性問題的解決（ie6，ie7....，火狐，谷歌，360，等親測相容）
在使用angular包的時候，會遇到一些相容性問題，下面的程式碼是一個解決了相容性問題的一段程式碼。
程式碼如下：
<!--[if lte IE 8]> <!DOCTYPE html><![endif]-->
<html id="ng-app" class="ng-app:TestApp" ng-app="TestApp">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/>
<title>ANGULAR TEST</title>
<style>
fieldset {
border: black solid 1px;
}
.a{
}
.sky{
background-color:#99ccff;
}
</style>
<script src="/fs/scripts/angular.min.v125.js"></script>
</head>
<body ng-controller="TestCtrl">
<h2 style="color:#009933;font-family:Arial">TESTTD</h2>
<table cellpadding=1 cellspacing=2 style="width:600px;font-family:Arial" class="a"><tr>
<td style="width:300px">ETB ID</th>
<td style="width:300px">{{Test == null ? "---" : Test[0].TESTAAA}}</td>
</tr>
<tr>
<td>Train Topography Counter</th>
<td>{{Test == null ? "---" : Test[0].TESTBBB}}</td>
</tr>
</table>
<br />
<fieldset>
<legend style="color: #009933;font-size:22px;font-family:Arial">List</legend>
<table cellpadding=1 cellspacing=2 style="width:890px;font-family:Arial" class="a">
<tr align="left" class="r5" style="background:#009933;color:#fff">
<th style="width:370px">UUID</th>
<th style="width:150px">Orientation</th>
<th style="width:130px">Number</th>
<th style="width:240px">Counter</th>
</tr>
<tr align="left" ng-if="Test != null" ng-repeat="entry in Test" ng-class="{'sky' : entry.TESTCCC == 'true'}">
<td>{{entry.UUID}}</td>
<td>{{entry.orientation}}</td>
<td>{{entry.number}}</td>
<td>{{entry.counter}}</td>
</tr>
</table>
</fieldset>
<script language="JavaScript">
function ANGULAR(httpobj,scopeobj)
{
httpobj({
//新增時間是為了每次從瀏覽器讀取時間使瀏覽器自己清除快取
url:'/cgi/json/Test.php?temptime=' + (new Date()).getTime(),
timeout:2000,
headers:{
'Content-Type':undefined
})
.success(function(data) {
scopeobj.Test = data.Testdatas;
})
.error(function() {
scopeobj.Test = null;
});
}
angular.module('TestApp', [])
.controller('TestCtrl', function($scope, $http)
{
document.title = 'Test';
$scope.title = 'Test';
ANGULAR($http,$scope);
setInterval(function() {
ANGULAR($http,$scope);
}, 2500);
});
</script>
</body>
</html>
下面幾個重點部分注意一下：
1.<!--[if lte IE 8]> <!DOCTYPE html><![endif]-->
2.<html id="ng-app" class="ng-app:TestApp" ng-app="TestApp">
3.<script src="/fs/scripts/angular.min.v125.js"></script>
這個js包的版本可以去網上找一下應該有，我會將這個包上傳的到CSDN。
4.<body ng-controller="TestCtrl">
ng-controller標識了控制範圍。
5.<td style="width:300px">{{Test == null ? "---" : Test[0].TESTAAA}}</td>
顯示部分，由於傳過來的資料是存放在json陣列中，所以去了Test【0】。
6. <tr align="left" ng-if="Test != null" ng-repeat="entry in Test" ng-class="{'sky' : entry.TESTCCC == 'true'}">
<td>{{entry.UUID}}</td>
這部分的ng-repeat是用來迭代的，ng-class用於用返回來的資料控制顯示的css。