Javascript 使用 AngularJS angular.extend 独立地向数组的每个对象添加属性
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/26410640/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Adding property to each object of an array independently with AngularJS angular.extend
提问by Eric Mitjans
I have an existing array with an object and several properties created on a first step. It is created by the following function:
我有一个现有数组,其中包含一个对象和第一步创建的几个属性。它由以下函数创建:
$scope.recordlist = extractRecordJSONFromLocalStorage();
$scope.addRecord = function () {
$scope.recordlist.push(
{
date: $scope.dateJson,
time: $scope.time,
car: $scope.carList.code,
driver: $scope.driverList.name,
from: $scope.locationList.place,
destination: $scope.locationList2.place,
pax: $scope.paxList
}
);
$scope.custom = $scope.custom === false ? true: false;
$scope.carList = 0;
$scope.driverList = 0;
$scope.locationList = 0;
$scope.locationList2 = 0;
jsonToRecordLocalStorage($scope.recordlist);
};
It results in the following array:
它导致以下数组:
[{
"date":"2014 10 16",
"time":"20.22",
"car":"396",
"driver":"Seb",
"from":"A",
"destination":"B",
"pax":"3"
}]
What I'm trying to do is to add another property into the existing object on the next step with ng-click. I've tried with the following function but it doesn't seem to work.
我想要做的是在下一步中使用 ng-click 将另一个属性添加到现有对象中。我已尝试使用以下功能,但似乎不起作用。
$scope.insertRecord = function (recordlist) {
var arrival = { 'arrival' : moment().format("HH.mm") }
console.log(arrival)
angular.extend($scope.recordlist, arrival)
jsonToRecordLocalStorage($scope.recordlist);
}
The end result I'm looking for is the following:
我正在寻找的最终结果如下:
[{
"date":"2014 10 16",
"time":"20.22",
"car":"396",
"driver":"Seb",
"from":"A",
"destination":"B",
"pax":"3",
"arrival":"23.10"
}]
Maybe another thing to take also into consideration is that in the app it exists the possibility of having many different objects being listed, some that have the arrivalproperty already defined, but some that will have it later in time.
也许另一件需要考虑的事情是,在应用程序中可能会列出许多不同的对象,有些对象arrival已经定义了属性,但有些对象会在稍后的时间里拥有。
Any pointers?
任何指针?
EDIT
编辑
The 2 solutions I got worked but didn't accomplish what I am looking for, so probably I was unclear on what I am trying to do.
我得到了 2 个解决方案,但没有完成我正在寻找的东西,所以我可能不清楚我想要做什么。
I am saving a collection of objects into an array, each object has a property arrivalthat will be defined on a second step.
我将一组对象保存到一个数组中,每个对象都有一个arrival将在第二步定义的属性。
So first I create an array of objects like this:
所以首先我创建一个这样的对象数组:
[
{
"date":"2014 10 16",
"time":"20.42",
"car":"396",
"driver":"Seb",
"from":"A",
"destination":"B",
"pax":"3",
},
{
"date":"2014 10 16",
"time":"20.12",
"car":"319",
"driver":"Seb",
"from":"C",
"destination":"D",
"pax":"4",
},
{
"date":"2014 10 16",
"time":"20.22",
"car":"396",
"driver":"Seb",
"from":"G",
"destination":"A",
"pax":"1",
}
]
This is displayed on the view in a table-like layout. Each row contains the data from an object, and initially doesn't include the property arrivalbecause the app tracks car movements and the car has not arrived to destination.
这以类似表格的布局显示在视图上。每行包含来自对象的数据,最初不包含属性,arrival因为应用程序跟踪汽车移动并且汽车尚未到达目的地。
Each row has also a button triggering insertRecord(), that defines the arrival time and its supposed to include the arrivalproperty into each object, independently.
每行还有一个按钮 triggering insertRecord(),它定义了到达时间,并且应该arrival独立地将属性包含到每个对象中。
So in this example, maybe the car from the second object arrived, and I want to be able to add the arrivalproperty only for this particular object, leaving the array like this:
所以在这个例子中,也许来自第二个对象的汽车到达了,我希望能够只为这个特定对象添加arrival属性,让数组像这样:
[
{
"date":"2014 10 16",
"time":"20.42",
"car":"396",
"driver":"Seb",
"from":"A",
"destination":"B",
"pax":"3"
},
{
"date":"2014 10 16",
"time":"20.12",
"car":"319",
"driver":"Seb",
"from":"C",
"destination":"D",
"pax":"4",
"arrival":"20.35"
},
{
"date":"2014 10 16",
"time":"20.22",
"car":"396",
"driver":"Seb",
"from":"G",
"destination":"A",
"pax":"1"
}
]
The 2 proposed solutions from dfsq allowed me to both define arrival for the first object of the array, or for all the objects at once, but not for each object separately.
dfsq 提出的 2 个解决方案允许我同时为数组的第一个对象或所有对象定义到达,但不能分别为每个对象定义。
This is the HTML code where insertData is called:
这是调用 insertData 的 HTML 代码:
<div class="row msf-row" ng-repeat="record in recordlist | filter: search">
<div class="col-md-1">{{record.time}}</div>
<div class="col-md-1"><strong>{{record.car}}</strong></div>
<div class="col-md-1">{{record.driver}}</div>
<div class="col-md-3">{{record.from}}</div>
<div class="col-md-3">{{record.destination}}</div>
<div class="col-md-1">{{record.pax}}</div>
<div class="col-md-1">
<button ng-click="insertRecord()" ng-show="!record.arrival"><i class="fa fa-cog"></i></button>{{record.arrival}}
</div>
</div>
Being so, any hints on how to get there?
既然如此,有关如何到达那里的任何提示?
回答by dfsq
According to your code $scope.recordlistis an array of objects. So you probably want this:
根据您的代码$scope.recordlist是一个对象数组。所以你可能想要这个:
angular.extend($scope.recordlist[0], arrival);
UPDTo update every object in the array you can use mapmethod:
UPD要更新数组中的每个对象,您可以使用map方法:
$scope.recordlist = $scope.recordlist.map(function(obj) {
return angular.extend(obj, arrival);
});
回答by a better oliver
If understand your question correctly you want to update a single record by adding arrival. Pass the record to insertRecord:
如果正确理解您的问题,您希望通过添加arrival. 将记录传递给insertRecord:
<button ng-click="insertRecord(record)" ng-show="!record.arrival">
There you can add the property to the respective record:
在那里您可以将属性添加到相应的记录中:
$scope.insertRecord = function (record) {
record.arrival = moment().format("HH.mm");

