2017-02-19 7 views
1

すべての項目に選択範囲を持つng-repeatがあります。オブジェクトをAngularJSの配列の既存の値に置き換えます。

ユーザーは値を選択することができます(オブジェクトを配列にプッシュする関数をトリガすることもできます)。しかし、コードを変更することもできます。その場合、コードは新しい値を持つ2番目のオブジェクトをプッシュし、 1。

どのように実際に既存の値を削除して、すべての変更時に最後の値のみを残すことができますか?ここで

は私のHTMLです:

<select ng-change="insertproduct(pa.nom, basket)" ng-model="basket"> 
    <option ng-repeat="select in numberofproducts">{{select}}</option> 
</select> 

そして、私のjavascript:

$scope.numberofproducts = [1,2,3,4,5,6,7,8,9,10] 

$scope.singleorder = []; 

$scope.insertproduct = function(nom, basket){ 
    $scope.numero = { 
    'producte': nom, 
    'numero': basket 
    }; 
    $scope.singleorder.push($scope.numero); 
    console.log($scope.singleorder); 
} 

アイデアが配列に等しいパラメータ'producte'を持つオブジェクトが含まれている場合、これに条件を作成することです新しいもの、既存のものを削除して新しいものを押します。

ヒント?

答えて

0

最初にfindIndexメソッドを使用して、同じプロパティを持つオブジェクトがすでにsingleorder配列に存在するかどうかを確認します。

function duplicateOrder(order) { 
    return order.producte === nom; 
} 
var index = $scope.singleorder.findIndex(duplicateOrder); 

注:findIndexためbrowser supportが限られています。 Internet Explorerではサポートされていません。

その後spliceで項目を削除します。

if(index > -1){ 
$scope.singleorder.splice(index, 1); 
} 

あなたは、その後に新しいものをプッシュすることができます


また、あなたのコーディングスタイルをクリーンアップする必要がありますはフランス語を混在させないでください英語を使用し、camelCaseまたはsnake_caseのいずれかを使用して、r愉快さ。

0

観察:

  • 使用AngularJS ngOptions属性の代わりに、ng-repeat
  • 配列内の要素のindexを確認することができます。既に存在する場合は、以前の要素を簡単に削除できます。

DEMO

var myApp = angular.module('myApp',[]); 
 

 
myApp.controller('MyCtrl',function($scope) { 
 
    $scope.numberofproducts = [1,2,3,4,5,6,7,8,9,10] 
 

 
    $scope.newArray = []; 
 

 
    $scope.insertproduct = function(basket) { 
 
     var prevIndex = $scope.newArray.indexOf(basket); 
 
     if(prevIndex > -1) { 
 
     $scope.newArray.splice(prevIndex, 1); 
 
     } else { 
 
     $scope.newArray.push(basket); 
 
     } 
 
     console.log($scope.newArray); 
 
    } 
 
    
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="MyCtrl"> 
 
<select ng-change="insertproduct(basket)" ng-model="basket" ng-options="select for select in numberofproducts"> 
 
</select> 
 
</div>

関連する問題