ng-repeat與ng-init結合使用

Question

控制器已經在init上加載了$ scope.shops。 與延遲和承諾等異步。我為每個商店創建一個可用的面板。 然后我想為每個項目添加列。

我在控制器getItemsPerShop（item）中有一個方法，它也是異步等。我目前得到兩個面板（有兩個商店），但項目是相同的..可能導致異步問題和$ scope.items沒有下載得足夠快，我將如何解決這個問題。

   <div ng-repeat="shop in shops">
        <div class="panel panel-default">
            <div class="panel-heading">shop {{shop}}</div>
            <table class="table">
                <thead ng-init="getItemsPershop(shop)">
                    <tr>
                        <th>Number</th>
                        <th>Date</th>
                    </tr>
                </thead>
                <tbody ng-repeat="item in items"> 
                    <tr>
                        <th scope="row">{{item.nr}}</th>
                        <td>{{item.desc}}</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>

這就像一個嵌套的情況，每個面板需要加載它的行。

Answer 1

我將在控制器中創建getItemsPershop() 。

你忘記了ng-init的items =嗎？

<div ng-repeat="shop in shops">
        <div class="panel panel-default">
            <div class="panel-heading">shop {{shop}}</div>
            <table class="table">
                <!-- forgot "items =" ? -->
                <thead ng-init="items = getItemsPershop(shop)">
                    <tr>
                        <th>Number</th>
                        <th>Date</th>
                    </tr>
                </thead>
                <tbody ng-repeat="item in items"> 
                    <tr>
                        <th scope="row">{{item.nr}}</th>
                        <td>{{item.desc}}</td>
                    </tr>
                </tbody>
            </table>
        </div>
</div>

Answer 2

模板的外觀，您的范圍中有一個數組items 。 但是，您需要將它嵌套在商店中，否則您無法區分它們。

最后它看起來像這樣：

<tbody ng-repeat="item in shop.items"> 
    <tr>
        <th scope="row">{{item.nr}}</th>
        <td>{{item.desc}}</td>
    </tr>
</tbody>

如在另一個答案中所指出的，您可以將項目分配給當前商店本地范圍內的字段items 。 但是我不鼓勵你這樣做。 來自文檔 ：

ngInit只有少數適​​當的用途，例如用於別名ngRepeat的特殊屬性，如下面的演示所示; 並通過服務器端腳本注入數據。 除了這幾種情況，您應該使用控制器而不是ngInit來初始化作用域上的值。

在角度中，您應該在控制器中初始化模型並通過模板渲染它。 混合這兩者會使您的代碼更難理解，測試和維護。