AngularJS 依回傳內容變換對應項目

也是最近遇到要弄的功能，有可能我們得到的 json 是這樣

view plaincopy to clipboardprint

1. $scope.memberlist= [   
2.     {type:'ou', name:'CSSI', email:'[email protected]'},   
3.     {type:'group', name:'III', email:'[email protected]'},   
4.     {type:'user', name:'Jack', email:'[email protected]'},   
5.     {type:'user',name:'Jack', email:'[email protected]'}   
6. ];  

可是我們需要根據 type 的不同給不一樣的圖片，這時候就會需要再去判斷一次。

html 長這樣

view plaincopy to clipboardprint

1. <ul>  
2.     <li ng-repeat="member in memberlist" class="clearfix">  
3.         <img ng-src="{{type2image(member)}}">  
4.         <div class="mem_con">{{member.name}}   
5.             <div class="mem_mail">{{member.email}}</div>  
6.         </div>  
7.     </li>  
8. </ul>  

這邊希望依 type 的不同顯示不一樣的圖，所以在家這段 function 去轉換

view plaincopy to clipboardprint

1. $scope.type2image = function(item){   
2.     return {ou:"http://www.wingzero.tw/msn/lanew/bear/lol.gif",   
3.         group:"http://www.wingzero.tw/msn/lanew/bear/lanlanlu.gif",   
4.         user:"http://www.wingzero.tw/msn/lanew/bear/hehe.gif"  
5.     }[item.type]||"";   
6. };  

Demo