角條件格式化json

我有一個用jquery編寫的小應用程序，並且想將它翻譯成angularjs。角條件格式化json

但我需要一些建議，如果有可能與angularJs。在我的應用程序中，我做了一些Ajax調用，檢索Json，然後解析它並注入dom。

這裏的問題是，我的json屬性是：簡單的字符串，數組或嵌套json對象。

因此，當我解析json格式時：例如我遍歷數組並構建一個數據表，或者解析一個字符串並獲取字符串的長度。然後我輸出所有的dom。

這是jQuery中有點冗長，但使其成爲可能。我想知道我能否與AngularJs做類似的事情。

$.each(data.ALLIMG, function(i, image) { 
    if(image.alt){ 
     $("#imagesDetail").append("<li>ALT:" + image.alt + " SRC: "); 
     $("#imagesDetail").append(image.src + "</li>"); 
     totalAltImg++; 
    } 
}); 
$("#text").append("<p>" + data.TEXT + "</p>"); 
$("#text").append("<p><b>Length: </b>" + data.TEXT.LENGTH + " character(s)</p>");

在我的角度我應該使用類似{{text}}知識，但如果它是一個數組我怎麼輸出表？或列表？

來源

2013-05-04 Tropicalista

對您想要使用NG-重複陣列 – lucuma 2013-05-04 01:15:24

這裏是一個完整的工作示例。您可以使用ng-show來測試該屬性是否存在，但在此示例中它將呈現隱藏，但它比過濾器簡單得多。我還提供了一個簡單的過濾器完整示例。 data.TEXT我只是假定你想要統計那些文本的字符。

演示：http://plnkr.co/br2M4GXrDENd4rLkDBho

<!-- with ngshow --> 
<ul id="imagesDetail"> 
    <li ng-repeat="image in data.ALLIMG" ng-show="image.alt"> 
    ALT: {{image.alt}} SRC: {{image.src}} 
    </li> 
</ul> 
<!-- with filter see below --> 
<ul id="imagesDetail2"> 
    <li ng-repeat="image in data.ALLIMG | filter:hasAlt" > 
    ALT: {{image.alt}} SRC: {{image.src}} 
    </li> 
</ul> 

<div id="text"> 
    <p>{{data.TEXT}}</p> 
    <p><b>Length: </b> + {{data.TEXT.length}} character(s)</p> 
</div>

控制器過濾器：

$scope.hasAlt = function(image) { 
    return image.alt!==undefined; 
}

來源

2013-05-05 15:40:01 lucuma

有一件事你應該注意的是，一般控制不應該做任何DOM操作。 – lucuma 2013-05-06 11:50:56

應該是這個樣子

<ul> 
    <li ng-repeat='image in data.ALLIMG'> ALT: {{image.alt}} {{image.src}}</li> 
</ul>

如果您需要過濾掉無效數據（如你在你的例子做），你可以在你的控制器定義過濾謂詞：

<ul> 
    <li ng-repeat='image in data.ALLIMG| filter:properImages'> 
    ALT: {{image.alt}} {{image.src}}</li> 
</ul>

來源

2013-05-04 01:22:53 Thilo

角條件格式化json

回答

相關問題