循环遍历嵌套对象 [英] Loop through nested object in angular

问题描述

我想遍历嵌套对象.

"movieRating": {
"rate": [{ 
    "rating9": 9,
    "count9": 158
}, {
    "rating8": 8,
    "count8": 101
}, {
    "rating7": 7,
    "count7": 32
}, {
    "rating6": 6,
    "count6": 48
}, {
    "rating5": 5,
    "count5": 125
}],
"totalCount": 456}

这是我的HTML文件

<div *ngFor="let movie of movies" class="container">
    <table   class="table">
        <tbody>
            <tr >
                <th><img src="#"></th>
                <td >{{movie.movieRating.rating9}}</td>
            </tr>
        </tbody>
   </table>
</div>    

如果我尝试 {{movie.movi​​eRating.rating9}} ，则此操作无效.但是 {{movie.movi​​eRating.totalCount}} 可以工作.有没有一种方法可以获取 rating9 和 count9 .

If I try {{movie.movieRating.rating9}} this is not working. But {{movie.movieRating.totalCount}} works. Is there a way to get rating9 and count9.

推荐答案

Rating9 位于费率数组的位置0，因此您可以使用 {{movie.movi​​eRating.rate [0] .rating9}} .

Rating9 is in position 0 of the rate array, so to access it you can use {{movie.movieRating.rate[0].rating9}}.

<div *ngFor="let movie of movies" class="container">
    <table   class="table">
        <tbody>
            <tr >
                <th><img src="#"></th>
                <td >{{movie.movieRating.rate[0].rating9}}</td>
            </tr>
        </tbody>
   </table>
</div>   

这篇关于循环遍历嵌套对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！