遍歷Javascript中的對象數組

Question

我正在使用angularjs。我有一個選擇框。在選擇中，我通過執行ng-repeat顯示所有運動名稱，其中可以選擇多個運動名稱。

這是我的HTML

<div class="form-group">
    <label for="exampleInputEmail1">Selct Exercises</label>
    <select class="form-control select2" multiple>
        <option data-ng-repeat="exercise in exercises" value="
        {{exercise}}" data-ng-checked="selection.indexOf(exercise) > -1" data-ng-click="toggleSelectionExercise(exercise)">
            {{exercise.name}}</option>
    </select>
</div>

現在選擇多個練習名稱onclick之后，我正在調用此函數

Controller.js

$scope.parameterTest = [];
$scope.parameter1 = [];
var exercise = [];
$scope.toggleSelectionExercise = function
toggleSelection(exercise) {
  var idx = $scope.parameterTest.indexOf(exercise);
  if (idx > -1) {
    $scope.parameterTest.splice(idx, 1);
  } else {
    console.log(exercise);
    $scope.parameterTest.push(exercise);
    for (var i = 0; i < $scope.parameterTest.length; i++) {
      var parameter1 = {
        "exid": exercise._id,
        "modify": 0,
        "sets": exercise.sets,
        "reps": exercise.reps,
        "rest_duration": 60,
        "ord": 0
      };
      /*Setting in json format and storing in parameter1*/
      $scope.parameterTest[i] = parameter1;
      /*parameter1 value passing to $scope.parameterTest[i]*/
      console.log($scope.parameterTest[i]);
    }
  }
}

我正在將運動對象傳遞給函數。從運動對象中我正在設置值並以JSON格式傳遞並將其存儲在變量parameter1 。

我想將下拉菜單中選擇的每個對象設置為此格式，這就是為什么我要迭代每個對象並設置格式和值。

但是現在如果我從下拉列表中選擇一個選項，它將顯示該對象並設置正確的值和格式;但是如果我選擇多個選項，則對於2個選項，它將顯示如下

以JSON格式設置的第一個對象值
對象{exid: "59bc2dbc53bdcb7171732eab", modify: 0, sets: 3, reps: Array[6], rest_duration: 60…}

在JSON格式對象{exid: "59bc2d9453bdcb7171732eaa", modify: 0, sets: 3, reps: Array[6], rest_duration: 60…}設置的第二個對象值{exid: "59bc2d9453bdcb7171732eaa", modify: 0, sets: 3, reps: Array[6], rest_duration: 60…}

顯示第二次對象的第二個選項{exid: "59bc2d9453bdcb7171732eaa", modify: 0, sets: 3, reps: Array[6], rest_duration: 60…}

如果我選擇兩個選項，它將顯示一次第一個對象，兩次顯示第二個對象。

我不知道我在哪里做錯了。 我是否在正確執行循環？

Answer 1

可能是您在做什么是錯誤的。

JSfiddle用於工作示例代碼

對於“ else ”塊中的代碼，我有點困惑，在該代碼中，您將“ exercise ”對象推到“ $ scope.parameterTest ”數組，然后迭代並將從同一“ exercise ”對象獲得的另一個對象分配給“ $ scope”。 parameterTest ”數組。

而且我認為您在$ scope.parameterTest中檢查現有的“ exercise ”對象是錯誤的，因為您通過分配“ parameter1 ”值更改了保存在“ $ scope.parameterTest ”中的“ exercise”對象。

$scope.parameterTest[i] = parameter1;

如果您確實需要修改運動對象，請更改

var idx = $scope.parameterTest.indexOf(exercise);

至

var exerciseItemFoundInArray = false;
var exerciseItemFoundIndex = -1;
for(var i = 0; i < $scope.parameterTest.length; i++) {
    if ($scope.parameterTest[i].exid == exercise._id) {
        exerciseItemFoundInArray = true;
        exerciseItemFoundIndex = i;
        break;
    }
}

if (exerciseItemFoundInArray == true && exerciseItemFoundIndex != -1) 
{
    $scope.parameterTest.splice(idx, 1);
}

或查找以下所有大多數瀏覽器（IE-12，Chrome 45等）都支持的索引使用

var idx = $scope.parameterTest.findindex((item)=> {return item.exid == exercise._id});

我已經刪除了“ for”循環，因為它是不必要的。 函數“ toggleExerciseSelection”的修訂代碼

$scope.toggleSelectionExercise = function
toggleSelection(exercise) {
    var exerciseItemFoundInArray = false;
    var exerciseItemFoundIndex = -1;
    for(var i = 0; i < $scope.parameterTest.length; i++) {
        if ($scope.parameterTest[i].exid == exercise._id) {
            exerciseItemFoundInArray = true;
            exerciseItemFoundIndex = i;
            break;
        }
    }

    if (exerciseItemFoundInArray == true && exerciseItemFoundIndex != -1) 
    {
        $scope.parameterTest.splice(exerciseItemFoundIndex, 1);
        console.log( $scope.parameterTest);
    } else {
        var parameter1 = {
            "exid": exercise._id,
            "modify": 0,
            "sets": exercise.sets,
            "reps": exercise.reps,
            "rest_duration": 60,
            "ord": 0
        };
        $scope.parameterTest.push(parameter1);
        console.log( $scope.parameterTest);
    }
};

Answer 2

嘗試執行此ng-change和ng-model以在HTML中進行選擇

<select ng-model="is_checked" ng-change="hey(is_checked)" multiple>
  <option ng-repeat="x in names">{{x}}</option>
</select>

在Controller中is_checked返回單擊的選項，如果未添加則檢查選項是否在列表中，否則將其拼接。

$scope.checkedvalues = [];
$scope.hey = function(is_checked){
    var option = $scope.checkedvalues.indexOf(is_checked);
    // if option in list 
        $scope.checkedvalues.splice(option,1);
    }else{
        $scope.checkedvalues.push(is_checked);
    }
}