Ионный список, как обновить определенный элемент?

Question

Я разрабатываю приложение ios с угловыми и ионными. Я не знаю, как получить конкретный элемент в списке, который нужно обновить? Вот мое мнение: mesReservations.html

<ion-view cache-view="false" view-title="Mes reservations"> 
<ion-pane> 
    <ion-content class="padding"> 

<ion-list> 
<ion-item ng-repeat="reservation in listeReservations" class="item item-button-right"> 
{{reservation.nomLoisir}} 

<p>{{reservation.dateReservation}} |{{reservation.heureReservation}} | {{reservation.nbrpersonne}} pers</p> 

<p>{{reservation.etatResa}}</p> 
<div class="buttons"> 

     <button class="button button-small" ng-click="annulerReservation(reservation.idReservation)"> 
     <i class="icon ion-close"></i> 
     </button> 
</div> 
</ion-item> 
</ion-list> 
<ion-infinite-scroll ng-if="!theEnd" on-infinite="loadMore()" distance="50%"></ion-infinite-scroll> 
</ion-content> 
</ion-pane> 
</ion-view> 

мой контроллер: mesReservetionsController.js

(function() { 
    'use strict'; 
    angular 
     .module('starter') 
     .controller('MesReservationsController', MesReservationsController); 

    MesReservationsController.$inject = ['ReservationService', '$scope', '$state']; 
    function MesReservationsController (ReservationService, $scope, $state) { 
     $scope.listeReservations = []; 
     $scope.theEnd = false; 
     var page = 0; 
     $scope.enable= true; 



     //chargerReservations(); 
     $scope.loadMore = function() { 

      page++; 
      ReservationService.listReservation(page) 
       .then(function (result) { 


        if(result.params.reservation.length > 0){ 
         angular.forEach(result.params.reservation, function (value, key) { 
          $scope.listeReservations.push(value); 
         }) 
        } 
        else { 
         $scope.theEnd = true; 


        } 
       }) 
       .finally(function() { 
        $scope.$broadcast("scroll.infiniteScrollComplete"); 

       }); 

     } 

     /*$scope.confirmerReservation = function (idReservation) { 

      ReservationService.confirmerReservation(idReservation).then(function (res) { 
       if(res.statut==="1"){ 
        chargerReservations(); 
        alert(res.message); 
       } 
      }); 
     };*/ 
     $scope.partagerReservation = function (idReservation) { 
      alert("That's to share your reservation"); 
     } 
     $scope.showMap = function() { 
      alert("That shall show map"); 
     } 
     $scope.changerReservation = function (idReservation) { 
      debugger 
      $state.go('detailReservation', {idReservation: idReservation}); 
     } 
     $scope.detailLoisir = function() { 
      alert("that shall show detail"); 
     } 
     $scope.annulerReservation = function (idReservation) { 
      debugger 
      $scope.enable= false; 

      ReservationService.annulerReservation(idReservation).then(function (res) { 

       if(res.statut==="1"){ 
        alert(res.message); 
       } 
      }); 
     }; 
     function chargerReservations (page) { 
      debugger 
      ReservationService.listReservation(page).then(function (res) { 

      if(res.statut==="1"){ 
        $scope.$apply(function() { 
        $scope.listeReservations = res.params.reservation; 
       }) 


      } 
     }); 
     } 


    } 

})(); 

Что мне нужно обновить {{}} reservation.etatResa при ReservationService. annulerReservation() вызывается без необходимости перезагрузки списка с сервера?

Answer 1

Пройди весь объект в ваш метод, а не только ид:

ng-click="annulerReservation(reservation)" 

Тогда вы можете просто изменить его, как вы хотите (например, когда ReservationService.annulerReservation вызов преуспела):

reservation.etatResa = 'Whatever'; 

Не забудьте изменить, чтобы передать идентификатор этой услуге (если это необходимо):

ReservationService.annulerReservation(reservation.idReservation).then(...)