AngularJSのデバッグ方法

<pre>{デバックしたい変数|json}}</pre>でJSON形式で出力することができます。

<html ng-app>
 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script>
 <script>
var loopCtrl = function($scope) {
 $scope.week = [
  {"jp":"月","en":"Monday"},
  {"jp":"火","en":"Tuesday"},
  {"jp":"水","en":"Wednesday"},
  {"jp":"木","en":"Thursday"},
  {"jp":"金","en":"Friday"},
  {"jp":"土","en":"Saturday"},
  {"jp":"日","en":"Sunday"}
 ];
}
 </script>
 
 <div ng-controller="loopCtrl">
  <p>{{week.length}} days</p>
   <ul>
    <li ng-repeat="day in week">{{day.jp}} {{day.en}}</li>
   </ul>
   <pre>{{week|json}}</pre>
 </div>
</html>
	

デバッグのデモ

scirptで定義された[$scope.week]がJSONで表示されます。

{{week|json}}