如何通过一些价值

Question

“连接”在角2个变量我有控制器2个变量：

$scope.first = [ 
    { id="11", nameF="aaaa1" }, 
    { id="12", nameF="bbbb1" } 
] 

$scope.second = [ 
    { id="21", nameS="aaaa2", idFirst="11" }, 
    { id="22", nameS="bbbb2", idFirst="12" }, 
    { id="23", nameS="cccc2", idFirst="12" } 
] 

在模板中我有ngRepeat变量第二：

<div ng-repeat="item in second> 
    <div>{{item.nameS}}</div> 
    <div>{{item.idFirst}}</div> 
</div> 

对于每一个项目。 idFirst我想写出匹配的nameF来代替。达到这个目标的最佳做法是什么？我似乎无法找出一个简单的方法来做到这一点，但假设必须有一个。感谢名单！

Answer 1

可以使用自定义filter如果你不希望创建一个单独的对象持有的预期结构。

HTML：

<div ng-repeat="item in second"> 
    <div>{{item.nameS}}</div> 
    <div>{{item.idFirst | getMatchName:first}}</div> 
</div> 

JS：

.filter('getMatchName', function() { 

      return function(strName, arrFirst) { 

      arrFirst.forEach(function(val, key) { 

       if (val.id == strName) { 
       strName = val.nameF; 
       } 

      }) 

      return strName; 
      } 
     }) 

这里工作plunker

Answer 2

你可以把你的模板逻辑有点像代码，调用其他变量的值：yourValue[another.value].nameF

你的代码改成这样，它应该工作

<div ng-repeat="item in second> 
    <div>{{item.nameS}}</div> 
    <div>{{first[item.idFirst].nameF}}</div> 
</div> 

Answer 3

如果我理解正确的话，

$scope.getNameF = function(idFirst){ 
    for(var i = 0; i < $scope.first.length; i++){ 
     if($scope.first[i].id === idFirst){ 
      return $scope.first[i].nameF; 
     } 
    } 
    return undefined; 
} 

<div ng-repeat="item in second"> 
    <div>{{item.nameS}}</div> 
    <div>{{getNameF(item.idFirst)}}</div> 
</div> 

编辑

您也可以渲染之前准备数据：

for(var i = 0; i < $scope.second.length; i++){ 
    $scope.second[i].nameF = getNameF($scope.second[i].idFirst); 
} 

<div ng-repeat="item in second"> 
    <div>{{item.nameS}}</div> 
    <div>{{item.nameF}}</div> 
</div>