Получение данных из модального AngularJS

Question

Я пытаюсь получить данные FROM modal для вызова контроллера, и все примеры, которые я нашел, описывают только способ получения данных в модальные.

Каков правильный способ?

Это форма, я использую в модальный:

<form class="form-horizontal"> 

<div class="modal-body"> 

    <div class="control-group"> 
     <label class="control-label">Name:</label> 
     <div class="controls"> 
      <input type="text" ng-model="transaction.name" placeholder="Transaction name" /> 
     </div> 
    </div> 

    <div class="control-group"> 
     <label class="control-label">Category</label> 
     <div class="controls"> 
      <input type="text" ng-model="transaction.category" placeholder="Category" /> 
     </div> 
    </div> 

    <div class="control-group"> 
     <label class="control-label">Amount</label> 
     <div class="controls"> 
      <input type="text" ng-model="transaction.amount" placeholder="Amount" /> 
     </div> 
    </div> 

    <div class="control-group"> 
     <label class="control-label">Date</label> 
     <div class="controls"> 
      <input type="text" datepicker-popup="dd-MMMM-yyyy" ng-model="transaction.date" is-open="opened" min="minDate" max="'2015-06-22'" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" ng-required="true" /> 
      <button class="btn" ng-click="open()"><i class="icon-calendar"></i></button> 
     </div> 
    </div> 


</div> 

<div class="modal-footer"> 
    <button type="button" class="btn pull-left" data-dismiss="modal"> 
     <i class="icon-remove"></i>&nbsp;&nbsp;Cancel 
    </button> 
    <button type="submit" class="btn btn-primary" ng-disabled="pwError || incomplete" data-dismiss="modal" ng-click="createTransaction()"> 
     <i class="icon-ok icon-white"></i>&nbsp;&nbsp;Save Changes 
    </button> 
</div> 

Эти контроллеры:

moneyApp.controller("TransactionController", function($scope, $http, $modal, $log) { 
console.log("modal: ", $modal); 
$scope.transaction = {} 
$scope.open = function() { 

    var modalInstance = $modal.open({ 
     templateUrl: 'partials/modal.html', 
     controller: 'ModalInstanceController', 
     resolve: { 
      transaction: function() { 
       return $scope.transaction; 
      } 
     } 
     }); 

    modalInstance.result.then(function (receivedTransaction) { 
     $scope.selected = receivedTransaction; 
     console.log("Transaction received: ", transaction); 
    }, function() { 
     $log.info('Modal dismissed at: ' + new Date()); 
    }); 

}; 

$http({method: 'GET', url: 'transactions/15/all/'}).success(function(data) { 
    $scope.transactions = data; // response data 
}); 
}) 

и

moneyApp.controller("ModalInstanceController", function($scope, $modalInstance, $http,  transaction) { 
$scope.createTransaction = function() { 

    console.log("Transakcja: ", $scope.transaction); 
    $scope.transaction.budgetId = 15; 
    $scope.selected = { 
     item: $scope.transaction 
    } 
    $http({method: 'POST', url: 'transactions/add/', data : $scope.transaction, headers:{'Accept': 'application/json', 'Content-Type': 'application/json; ; charset=UTF-8'}}).success(function(data) { 
     console.log("Transaction succesfully added to a DB..."); 
    }); 
} 


$scope.ok = function() { 
    $modalInstance.close($scope.selected.item); 
}; 

$scope.cancel = function() { 
    $modalInstance.dismiss('cancel'); 
}; 
}); 

Когда я пытаюсь вызвать метод createTransacti on, $ scope.transaction не определено. Как получить данные из этой формы?

Answer 1

Я думаю, вам нужно назначить транзакцию для $ scope.transaction в вашем ModalInstanceController, потому что вы передаете объект транзакции, но не помещаете ее в $ scope.

$ scope.transaction = сделка

Answer 2

В вашем модальной форме вам нужно пройти нг-модель объект (т.е. транзакция) для функции (createTransaction()), который вызывается по форме представить.

<button type="submit" class="btn btn-primary" ng-disabled="pwError || incomplete" data-dismiss="modal" ng-click="createTransaction(transaction)"> 
     <i class="icon-ok icon-white"></i>&nbsp;&nbsp;Save Changes 
</button> 

И в вашем контроллере добавить объект в качестве параметра в функцию java-script.

$scope.createTransaction = function(transaction) { 

    console.log("transaction details: "+ transaction.category+" "+transaction.amount); 
}; 

Сообщите мне, если вы столкнулись с какими-либо проблемами, я могу поделиться своим рабочим кодом.