2つの配列と重複しない連結を比較します

Question

私は2つの配列を持っています。 searchWordsの単語をクリックすると、currentWordlistに単語を追加したり削除したりすることができます。

私が持っておきたいのは、実際にはcurrentWordlistにある単語を上書きすることなく、すべてのsearchWordsをcurrentWordlistに転送するボタンです。

私はこのコードを思い付いた：

$scope.addAll = function() { 
    var searchWords = []; 
    var currentWords = []; 

    // safes all searchwords to the array 
    for (var i = 0; i < $scope.searchWords.length; i++) { 
     searchWords.push($scope.searchWords[i]); 
    } 

    // safes all currentwords to the array 
    for (var j = 0; j < $scope.currentWordlist.length; j++) { 
     currentWords.push($scope.currentWordlist[j]); 
    } 

    console.log("searchWords " + searchWords.length); 
    console.log("currentWords " + currentWords.length); 

    angular.forEach(searchWords, function(value1, key1) { 
     angular.forEach(currentWords, function(value2, key2) { 
     if (value1._id !== value2._id) { 
      $scope.currentWordlist.push(value1); 
     } 
     }); 
    }); 
    }; 

私は重複があるかどうかを確認するために私の2 angular.forEach内の配列を使用することができるように、私は配列の両方を通過し、安全にそれら。私がcurrentWordlistにプッシュしなければ。しかし、それは動作していません。 [ngRepeat:dupes]エラーが表示されますが、リストから削除すると間違った単語が削除されるため、$ indexでトラックを使用することはできません。私はここで何か批判的に何かしていると思いますが、これまでのところ（試行錯誤の時間は0）

Answer 1

フィルターとng-repeatのディレクティブを使用することをお勧めします。次のようなコードは次のようになります。

あなたのビューで

$scope.addAll = function() { 
    // use angular.copy to create a new instance of searchWords 
    $scope.combinedWords = angular.copy($scope.searchWords).concat($scope.currentWordlist); 
}; 

そして：

<div ng-repeat="word in combinedWords | unique:'_id'"> 
    {{word}} 
</div> 

使用法：

colection | uniq: 'property' 

ネストされたプロパティでフィルタすることも可能：

colection | uniq: 'property.nested_property' 

Answer 2

あなたは単にこのようにすることができます

angular.forEach($scope.searchWords, function(value1, key1) { 
     var temp=true; 
     angular.forEach($scope.currentWordlist, function(value2, key2) { 
     if (value1.id === value2.id) 
      temp=false; 
     }); 
     if(temp) 
     $scope.currentWordlist.push(value1); 
    }); 

var app = angular.module("app", []); 
 
app.controller("ctrl", function($scope) { 
 
    
 
    $scope.searchWords=[{id:1,name:'A'},{id:2,name:'B'},{id:1,name:'A'},{id:4,name:'D'}]; 
 
    $scope.currentWordlist=[]; 
 
    $scope.addAll = function() { 
 
    
 
    angular.forEach($scope.searchWords, function(value1, key1) { 
 
     var temp=true; 
 
     angular.forEach($scope.currentWordlist, function(value2, key2) { 
 
     if (value1.id === value2.id) 
 
      temp=false; 
 
     }); 
 
     if(temp) 
 
     $scope.currentWordlist.push(value1); 
 
    }); 
 
    
 
    console.log($scope.currentWordlist); 
 
    }; 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app" ng-controller="ctrl"> 
 
    <button ng-click="addAll(newWord)">Add</button> 
 
    <div>{{currentWordlist}}</div> 
 
</div>