How to access ng model value in popup model controller in angular?

Question

I want to access ngModel from the controller, but here ngModel is defined in the popup input field. I want to access the qty and name values ​​in the controller. Note that all of this code is a model popup.

Model code

<ion-modal-view> <ion-header-bar> <h1 class="title">Item Details</h1> </ion-header-bar> <ion-content padding="true"> <form ng-submit="addItem()"> <div class="list list-inset"> <label class="item item-input"> <span class="input-label">Name</span> <input type="text" name="name" ng-model="name"> </label> <label class="item item-input"> <span class="input-label">Qty</span> <input type="number" name="qty" ng-model="qty"> </label> <div class="padding item text-center"> <button class="button button-dark">Add To Cart</button> <a class="button button-assertive" ng-click="closeModal()">Cancel</a> </div> </div> </form> </ion-content> </ion-modal-view> 

Controller code

 .controller('GuestDetailsCtrl', function($scope){ $scope.addItem = function() { alert($scope.name); alert($scope.qty); }; }); 

Answer 1

You can try to give parameters in the function as follows:

 <ion-modal-view> <ion-header-bar> <h1 class="title">Item Details</h1> </ion-header-bar> <ion-content padding="true"> <form ng-submit="addItem(params)"> <div class="list list-inset"> <label class="item item-input"> <span class="input-label">Name</span> <input type="text" name="name" ng-model="params.name"> </label> <label class="item item-input"> <span class="input-label">Qty</span> <input type="number" name="qty" ng-model="params.qty"> </label> <div class="padding item text-center"> <button class="button button-dark">Add To Cart</button> <a class="button button-assertive" ng-click="closeModal()">Cancel</a> </div> </div> </form> </ion-content> 

And in your controller:

  .controller('GuestDetailsCtrl', function($scope){ $scope.addItem = function(params) { alert(params.name); alert(params.qty); }; });