Angularjs ng repeat与ng init结合使用

Angularjs ng repeat与ng init结合使用,angularjs,Angularjs,控制器已在init上加载$scope.shops。与延迟和承诺等不同步。。我为每个可用的商店创建一个面板。然后我想为每个项目添加列 我在控制器getItemsPerShop(item)中有一个方法,它也是异步的。。我目前有两个面板(有两个商店),但项目是一样的。。可能是异步问题和$scope.items下载速度不够快的原因,我将如何着手解决这个问题 <div ng-repeat="shop in shops"> <div class="panel pane

控制器已在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>

商店{{shop}
数
日期
{{item.nr}
{{item.desc}}

这就像一个嵌套的情况,每个面板都需要加载它的行。

我将在控制器中制作
getItemsPershop()

您是否忘记了
ng init
中的
项=

<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>

商店{{shop}
数
日期
{{item.nr}
{{item.desc}}

按照模板的外观,您的范围内有一个数组
项。但是,您需要将其嵌套在商店中,否则您无法区分它们

最后,它将是这样的:

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

{{item.nr}
{{item.desc}}
正如在另一个答案中指出的,您可以将项目分配到当前商店本地范围内的字段
items
。然而,我不鼓励你这样做。发件人:

ngInit只有一些合适的用途,例如,在下面的演示中可以看到,为ngRepeat的特殊属性别名;以及通过服务器端脚本注入数据。除了这几种情况之外,还应该使用控制器而不是ngInit来初始化作用域上的值


在angular中,您应该在控制器中初始化一个模型,并通过模板进行渲染。混合使用这两个选项会使您的代码更难理解、测试和维护。

是我的问题还是您没有正确地阐明问题?车间面板中列出的项目是相同的,而它们不应该是相同的,因为ng init应该为每个面板加载唯一的项目。但是我现在看到我的工作方式是不可能的,因为我将每个面板的项绑定到同一个变量。我将在控制器端执行所有查询。控制器应返回完整数据,视图仅显示这些数据。为什么不将getItemsPershop(shop)放在控制器中?我会接受它,因为它让我想到了结构