将值绑定到对象属性,对象,数组中的AngularJS

时间:2014-09-05 03:39:17

标签: javascript angularjs angularjs-ng-repeat deep-linking 2-way-object-databinding

好的,这是泡菜:

我使用ng-repeat来遍历菜单项:

<!-- start the list/loop -->
<ion-list ng-repeat="this in menuItems.items track by $index" type="item-text-wrap">

    <a class="item" ng-click="addToCart({{this}})">{{this.name}}
        <span class="badge badge-stable">{{theCart[$index].product.qty}}</span>
    </a>

</ion-list>
<!-- end the list/loop -->

当我试图从购物车'theCart [$ index] .product.qty'中的商品中获取价值时出现问题,因为$ index没有绑定到任何特定商品,只是数组中的位置。我需要在数组深处获得一个唯一的标识符2个对象,所以我可以确保通过双向数据绑定获得正确的值Angular非常好提供。

theCart: [{
    product: {
        id: 1,
        section: 'sides',
        name: 'mayo',
        price: 7,
        outOfStock: '',
        qty: 1
    }
}, {
    product: {
        id: 0,
        section: 'sides',
        name: 'ranch',
        price: 6,
        outOfStock: '',
        qty: 1
    }
}];

提前感谢任何见解。

1 个答案:

答案 0 :(得分:0)

我不确定我是否理解了你的问题。

但假设menuItems.items是一系列产品,由于某种原因,其商品没有属性qtytheCart是其产品的不同产品数组有财产qty。您想要的是从数组theCart获取您正在迭代的产品的可用数量,您可以使用filter 'filter'来完成,如下所示:

<ion-list ng-repeat="item in menuItems.items" type="item-text-wrap">
    <a class="item" ng-click="addToCart(item.id)">{{item.name}}
        <span class="badge badge-stable">
           {{(theCart | filter:{product:{id:item.id} })[0].product.qty}}
        </span>
    </a>
</ion-list>

我必须说这是一种非常难看的方式,我不建议对任何人这样做。 在控制器中生成这两个数组的“连接数组”并迭代“连接数组”会好得多。