Angular ngRepeat увеличивает индекс $ и соответственно отображает представление.

#angularjs #angularjs-directive #angular-ui-router #angularjs-ng-repeat #ng-repeat

#angularjs #angularjs-директива #angular-ui-router #angularjs-ng-repeat

Вопрос:

Учтите, что у меня есть два представления, view1 и view2.

Я получаю массив из API в View1. Оттуда я пытаюсь перейти к view2 и динамически отображать view2 столько раз, сколько объектов в массиве, отслеживая по $index . (Это то, что является ожидаемым поведением)

В HTML я перехожу от view1 к view2 следующим образом:

Просмотр1:

     <div ng-repeat="factor in vm.testDetails.factor track by $index">
          <button ui-sref="app.factor_stans({factorName: factor.name, factorId: factor._id })" class="factorNamePress" > {{factor.name}} </button>
    </div>
  

Просмотр2:

 <div ng-click="vm.goToPrevDim()">Go to previous dimension</div>

<div ng-click="vm.goToNextDim()">Go to next dimension</div>


<label for="low_stan">Number of stens in low</label>
<input type="number" name="low_stan" ng-model="vm.low_stan">
</div>

<button ng-click="vm.fillStans()"> Submit Query</button>

<h1>Low Stan Fills</h1>
<div ng-include="vm.stanFills.lowStanFills">
 <!--This contains some input felds that I want to attach with this given url --> 
</div>
  

Я опубликую только соответствующие части контроллера ниже:

 vm.fillStans      = fillStans;
vm.goToPrevDim    = goToPrevDim;
vm.goToNextDim    = goToNextDim;

function selectedItemChange(item) {
          console.log("This is the item that I am gonna send to the backend");
          console.log(JSON.stringify(item));
          AdminService.getDetailsOfOneTest(item.value).then(function (response) {
            console.log("This is the details of the test");
            vm.testDetails = response.data;

            vm.finalObj = vm.testDetails.factor[vm.dimensionIndex.index]
            console.log(vm.testDetails);
            console.log("End of details of test");
            goToNextDim();
            goToPrevDim();
            // $location.path('app.factor_stans');




          })

       }





function goToNextDim() {





      vm.dimensionIndex.index =  vm.dimensionIndex.index   1;
    vm.finalObj = vm.testDetails .factor[vm.dimensionIndex.index];
    console.log(vm.finalObj);

  }



  function goToPrevDim() {




  vm.dimensionIndex.index =  vm.dimensionIndex.index - 1;
     vm.finalObj = vm.testDetails .factor[vm.dimensionIndex.index];
     console.log(vm.finalObj);





  }
  

Ожидаемое поведение заключается в том, что из view2 он должен иметь возможность переходить к следующему фактору или предыдущему фактору, когда я нажимаю на кнопку, но это не происходит.

Я потратил целый день, пытаясь решить эту проблему, и я рисую пробел. Пожалуйста, изучите это и посмотрите, не упустил ли я чего-то.

Ответ №1:

Вот моя JSFiddle: демонстрация реализации. Посмотрите, решит ли это вашу проблему.