Question

我有一张表，列出了基于json数组的所有可用产品。我还有一个json数组，其中包含用户之前选择的产品。当我回到产品列表时，我想更新显示的列表，以显示您已经选择了多少产品。

<table>
  <tr ng-repeat='product in products'>
    <td>{{product.productId}}</td>
    <td>{{product.name}}</td>
    <td>{{product.count}}</td>
  </tr>
</table>

(...)

$scope.products = '[{"productId": 1, "name":"Product A", "count": 0},
                    {"productId": 2, "name":"Product B", "count": 0},
                    {"productId": 3, "name":"Product C", "count": 0}]';

$scope.selectedProducts = '[{"productId": 2, "name":"Product B", "count": 5}]';

如何更新产品以便我在第二个产品上获得正确的计数？

Answer 1

以非常强大的方式，您可以使用过滤器

<table>
  <tr ng-repeat='product in products' ng-init="{{product.count = (selectedProducts | filter:product.name:true)[0].count || 0}}">
    <td>{{product.name}}</td>
    <td>{{product.count}}</td>
  </tr>

http://plnkr.co/edit/tPe0laCPdrXntu7LXa5a?p=preview

否则，您必须在控制器上遍历每个元素以查找匹配项，或者您可以创建一个过滤器来执行部分或服务以将逻辑排除在控制器之外。我担心没有神奇的解决方案（至少没有什么可以从我的头脑中思考）

如果您对产品和所选产品使用$http，您可以利用从这些来电中收到的承诺并调用迭代一次或在您确信它不应再被触发时销毁观察

承诺：https://docs.angularjs.org/api/ng/service/ $ q

许

products = $http.get(//products)
selected = $http.get(//selected)

$q.all([products, selected]).then(function(){
  //do the iteration here
})

观看

watchDestroyer = $scope.$watch('selectedProducts', function (){
  //destroy watch if you are confident there will be no updates
  watchDestroyer()
}, true)

结合AngularJS中的两个json源重复产品＆＃39;产品＆＃39;和＆＃39; SelectedProducts＆＃39;

1 个答案:

许

观看