ngRepeat範例 -- AngularJS

References: http://docs.angularjs.org/api/ng.directive:ngRepeat

以下是ngRepeat的範例：
有興趣可以連到CodePen看結果 http://codepen.io/CarterTsai/pen/mdxDI
不知道為什麼這個範例嵌入到Google Blogger會看到不結果

簡單講一下這個範例是作什麼，首先我有很多messages（格式是name : detail info）要秀
name在left的div中，任何一個name被點擊後會將details_info顯示在rigth的div中

而我這個範例也用到兩次ng-repeat，因為我的資料是由陣列包住多個物件，所以我為了將
資料正確拿出來，所以要用到兩次ng-repeat。

第一個ng-repeat是用來將每個陣列的資料拿出來。
第二個ng-repeat是用來將物件分成name跟val

HTML:

<div ng-app ng-controller='Ctrl' >
  <div class="left">
    <div class="box" ng-repeat="msg in messages">
      {{$index+1}}.
      <span ng-repeat="(name, val) in msg">
        <a href="#" ng-click="show(val)"> {{name}} </a>
      </span>
    </div>
  </div>
  <div class="right" >{{detail}}</div>
</div>
Check out this Pen!

JAVASCRIPT：

function Ctrl($scope){
  $scope.messages =[
    {'a':'a info'},
    {'b':'b info'},
    {'c':'c info'}
  ];
  
  $scope.show = function(val){
    $scope.detail =  val;
  }
}Check out this Pen!