Передача значения ng-repeat в Ionic Modal

Question

У меня есть ng-repeat для массива пользователей, и я хочу, чтобы иметь возможность нажимать на каждого пользователя, чтобы отображать их подробную информацию профиля в Ionic Modal.

Вот фактический HTML:

<div ng-repeat='user in users track by $index' ng-click="openModal()"> 
    <div class="col"> 
    <div class="col profile-image" > 
     <img src="img/default_user.jpg" class="connect_image" /><br />{{user.name}}<br /> 
     <span class="connect_subject">{{user.about}}</span> 
    </div> 
</div> 
</div> 

А вот образец Modal внутри этого шаблона:

<script id="profile-modal.html" type="text/ng-template"> 
    <div class="modal"> 
     <ion-header-bar> 
     <h1 class="title">{{user.name}}</h1> 
     </ion-header-bar> 
    </div> 
</script> 

Вопрос заключается в том, как я могу передать переменную ng-repeat пользователя в модальной, так что я может получить доступ user.name?

Answer 1

Вы просто должны применить функцию OpenModal() в particualr пользователя, вот код

<div ng-repeat='user in users track by $index' > 
      <div class="col"> 
      <div class="col profile-image" ng-click="openModal(user)"> 
       <img src="img/default_user.jpg" class="connect_image" /> 
       <br />{{user.name}} 
       <br /> 
       <span class="connect_subject">{{user.about}}</span> 
      </div> 
     </div> 
    </div> 

И в функции вы можете применить к области,

$scope.openModal = function(user) { 
      $scope.user = user; 
      $scope.modalCtrl.show(); 
     }; 

Вот Codepen

Answer 2

Вы можете передать $ scope родительского контроллера на контроллер modal;

$ionicModal.fromTemplateUrl('my-modal.html', { 
    scope: $scope 
}); 

Затем вы можете использовать данные родительской области в модальном контроллере. И я увидел это сейчас. Вы хотите передать свои пользовательские данные в ngRepeat для модального контроллера.

В этом случае ваш код должен быть следующим:

$ionicModal.fromTemplateUrl('modal.html', { 
    scope: $scope 
}).then(function(modal) { 
    $scope.modal = modal; 
}); 

$scope.openModal = function(data) { 
    $scope.selectedUser = data; 
    $scope.modal.show(); 
} 

Затем вы можете использовать выбранные пользователем данные с выбранным пользователем.

И вы можете посмотреть that.