Question

我在服务器端创建了两个表。第一个包含诸如房屋，房间，编号，街道等信息

第二个包含诸如first_color，房间房子，second_color ...

之类的信息。

当然，两个表的列和行数都不同。例如，第一行有5行，第二行只有2行（行动态增加）。

在阅读之前，他们都拥有一个“房间房子”数据的共同信息。我需要根据该链接字段“房间房子”来更改第一张桌子的颜色信息和第二张桌子的信息。

以下是我的HTML代码，使用了两次“ ng-repeat”：

document

但是，如果找不到公用信息，它将不会显示表格的其余部分。我需要在第一个表中显示整个信息，在第二个表中显示颜色信息。如果找不到信息（由于两个数组之间的行数不同，或者由于第二个数组中不存在数据），我必须继续使用默认颜色显示第一个数组的信息。

当然，添加带有ng-show =“ d.room_house！= item.room_house”的html div是行不通的，因为它将以两种颜色显示一些信息。 Controller 1

Controller 2

希望有人能够帮助我。

谢谢

Answer 1

您可以将逻辑移到控制器上，而不是HTML中的嵌套循环，并且HTML看起来更小，更干净，并且原始问题也将得到解决。试试这个解决方案，

var defaultColor = "#444444";
data.house.forEach(function(house) {
  house.color = defaultColor; // assign default color initially
  var obj = data.colors.filter(function(x){
     return x.room_house == house.room_house;
  }
  if(obj.length > 0) {
    house.color = obj[0].firsrt_color;
  } 
});

<div class="col-sm-6 col-md-4" ng-repeat="item in data.house | orderBy: '-count' | limitTo: data.limit">
     <div>
        <span ng-style="{ color: item.color}">{{::item.name}}</span>
     </div>
</div>

P.S：您希望使用“ firsrt_color”而不是“ first_color”。

AngularJS ng-repeat，表信息依赖

1 个答案: