配列のインデックス順を変更するにはどうすればよいですか？

Question

私はclickNext（）という関数を持つボタンを持っています。そのボタンがクリックされるたびに、 'arr1'という配列のインデックス位置（scope.selected）がインクリメントされます。

<button type="button" class="right-btn col-xs-6" role="menuitem" ng-click="clickNext()">Next</button> 

。

function clickNext() 
     { 
      scope.selected = (scope.selected + 1) % length; 
     } 


arr1 = [ 
     {apple: 1 , tango}, 
     {banana: 3, kappa}, 
     {orange:5, alpha}, 
     {apple: 8 , beta}, 
     {grape: 10 , sigma} 
     ] 

問題

私は 'ARR2' と呼ばれるARR1と同一の配列を持っています。私がしようとしているのは、arr1配列の代わりにのarr2配列に基づいて、次のインデックス位置にclickNext（）インクリメントを置くことです。

今すぐclickNext関数は、arr1配列の順番でインクリメントします。私はボタンをクリックした場合、それはオレンジ色に開始する：5その後、私はこれを達成するために マイかかわらプロセスを試してみましたが使用することです

arr2 = [ 
     {orange:5, alpha}, 
     {apple: 8 , beta}, 
     {banana: 3, kappa}, 
     {grape: 10 , sigma}, 
     {apple: 1 , tango} 
     ] 

など、リンゴ8へ移動しますfindIndex（）関数を呼び出し、arr2項目をarr1項目に一致させます。それは動作しませんが、おそらく私はそれを間違って構成していますか？

clickNext(){ 
    var oldIndex = filteredToXs(scope.selected); 
    scope.selected = oldIndex + 1;} 

function filteredToXs(filteredIndex) { 
    var firstArr = scope.arr1[ filteredIndex ]; 
    var xsIndex = scope.arr2.findIndex(function(item) { 
    return item.trackingNumber === firstArr.trackingNumber; 
}); 
if(xsIndex >= 0) return xsIndex; 
if(xsIndex === -1) return 0; // Default value 
} 

Answer 1

私はあなたの質問を正しく理解したと思います。コードセクションでも私のコメントを読んでください。

私はあなたのためのフィドルを作成することができたので、あなたのソースを変更する必要がありました。

HTML：私は、クリックイベントを変更し、

<button type="button" role="menuitem" onclick="clickNext();">Next</button> 

SAMPE配列を利用できないのCSSクラス削除：プロパティに..私は、アルファ、ベータ、タンゴを、変更された：彼らは、無効なオブジェクトを含むた を。また..これは問題にはならない値としてそれらを定義することができます。

var arr1 = [ 
    { apple: 1, tango: '' }, 
    { banana: 3, kappa: '' }, 
    { orange: 5, alpha: '' }, 
    { apple: 8, beta: '' }, 
    { grape: 10, sigma: '' }]; 

var arr2 = [ 
    { orange: 5, alpha: '' }, 
    { apple: 8, beta: '' }, 
    { banana: 3, kappa: '' }, 
    { grape: 10, sigma: '' }, 
    { apple: 1, tango: '' }]; 

コード：

var idx = 0; //save current index of array 2 

function clickNext() { 
    idx++; 

    //I'm comparing the array objects using a string compare- this only works because you said 'I have an identical array' 
    //this may cause issues if you're objects are cross-referenced 
    var find = function(array, obj) { //lookup value from arr2 in arr1 
     for (var i=0, l=array.length;i<l;i++) 
      if (JSON.stringify(array[i]) == JSON.stringify(obj)) //adjust this line to your needs 
       return array[i]; 
    } 
    var result = find(arr1, arr2[idx]) 
    if (!result) 
     throw new Error('not found- your arrays are not identical or you run out of index'); 
    console.log(result); 
} 

フィドル：https://jsfiddle.net/k50y8pp5/