AngularJS / JavaScript从另一个对象创建一个新对象

debugcn 发表于 Dev

米奇

我有一个问题，我已经坚持了一段时间，正在寻找一些建议。

在我的控制器上，我对后端进行了一次Restangular调用以检索一些数据，如下所示

AngularJS控制器（使用Restangular）

Pages.controller('PageContentController', ['$scope', '$routeParams', '$location', 'Restangular', function($scope, $routeParams, $location, Restangular) {

    $scope.id = $routeParams.id;

    Restangular.one('pages', $scope.id).getList('content').then(function(response) {
        $scope.content = response;

        $scope.content = _.forEach($scope.content, function(content) {
            content[content.name] = content.content;
        });
        console.log($scope.content);
    });

}]);

现在，当我注销时，$scope.content我得到一个包含三个对象的数组，它们看起来与此相似

Array[3]
    0: Object
        banner_heading: "Services",
        id: 1

    1: Object 
        banner_text: "some banner text",
        id: 2

    2: Object
        banner_img: "services.jpg",
        id: 3

这些对象还有很多，但是我已经简化了这个问题，这些是我想从对象中获得的唯一属性。

banner_heading，banner_text和banner_img都是使用lodash forEach循环在上面的控制器中动态创建的所有属性。

现在继续我要完成的工作。我需要从看起来像这样的对象数组中创建一个对象

{
    "banner_heading": {
        "data": "Services",
        "id": 1 
    },
    "banner_text": {
        "data": "some banner text",
        "id": 2 
    },
    "banner_img": {
        "data": "services.jpg",
        "id": 3 
    }
}

基本上，我认为我需要能够像这样输出数据，{{ banner_heading }}但是我还需要能够维护ID以在服务器端更新数据。

我不确定如何完成此操作，我已经费了好几个小时才对它感到困惑，非常感谢您的帮助。

lucuma

我将提出一种不需要对原始数组数据进行分组或执行任何操作的解决方案：

假设我们有这个问题：

 $scope.content = [{ banner_heading: "Services", id: 1}, {banner_text:'some text', id:2}, {banner_img:'service.jpg', id:3}];

我们可以编写一个函数来提取所需的内容：

$scope.getData = function(n) {
   // question states lodash is being used
   var row = _.find($scope.content, function(item) {
       return n in item;
   });
   return row[n];
}

$scope.getId = function(n) {
  var row = _.find($scope.content, function(item) {
       return n in item;
   });
   return row.id;
}

并在视图上：