Question

我通过PHP后端获得一个数组，如下所示：

{  
   "response":{  
      "code":"0000",
      "message":"OK"
   },
   "data":[  
      {  
         "id":"2",
         "description":"Description 1",
         "image":"work\/(1)(1).jpg",
         "job_id":"5",
         "final_upload":"N"
      },
      {  
         "id":"4",
         "description":"Description 2",
         "image":"work.jpg",
         "job_id":"5",
         "final_upload":"Y"
      }
   ]
}

在我的页面上，我有一个用户ID的重复列表，我需要将用户ID映射到我上面收到的数组中的job_id元素。这样将显示与该job_id相关的图像和描述。

如上所示，有两个值为“5”的job_id元素。

我通过将其解析为workList来接收上面的数组。

使用以下函数，我传入user_id并将其映射到workList数组，并尝试检索与该ID相关的图像和描述。

$scope.viewWork = function(id) {
                var uid = id;
                $scope.works = workList.map(item =>
                    ({
                        image: workList.find(work => work.job_id === uid).image,
                        description: workList.find(work => work.job_id === uid).description,
                    }));
            }

ID发布正常，然后我有一个ng-repeat元素来显示结果......

<tr ng-repeat="works in works">

<td>{{ works.image }}</td>
<td>{{ works.description }}</td>

</tr>

但我收到的只是第一个匹配的元素。第二个结果是第一个重复。但我确实得到了2个结果，这应该是什么，但问题是它们都是相同的而没有显示实际的第二个结果..

我正在尝试为job_id == 5获取匹配的图像和描述值，但它只返回第一个匹配元素两次....

感谢您的帮助。

Answer 1

原因是在map内你正在寻找与第一个结果匹配的find的job_id，因此将相同的结果（第一个）推到结果数组两次，因为有原始数组中的两个元素。

看看下面的代码。它可能会有所启发。

＆＃13;

var workList = [  
      {  
         "id":"2",
         "description":"Description 1",
         "image":"work\/(1)(1).jpg",
         "job_id":"5",
         "final_upload":"N"
      },
      {  
         "id":"4",
         "description":"Description 2",
         "image":"work.jpg",
         "job_id":"5",
         "final_upload":"Y"
      }
   ];

var viewWork = function(id) {
  var uid = id;
  return workList.map(item => (item.job_id == id ? {
    image: item.image,
    description: item.description,
  } : null));
}

console.log(viewWork(5))

＆＃13;

Answer 2

您正在查看该项目两次。

map

find

map

您可以简单地filter - ＆gt; map输出与您正在查找的内容相匹配，并以适当的格式返回。或者你可以用@JorgeObregon发布的条件来制作一张带有条件的地图。

$scope.works = workList
  .filter(item => item.job_id === id)
  .map(item => { image: item.image, description: item.description });

.map函数返回重复元素angularjs

2 个答案: