모달에서 함수로 데이터를 전달하는 방법

Question

여러 입력 텍스트 양식 컨트롤이있는 모달 폼이 있습니다. ng-grid이 업데이트되도록 데이터를 데이터베이스에 전달하려면 어떻게합니까?

$scope.open 컨트롤러 섹션 내에서 내 ajax 만들기 기능을 호출합니까? 아니면 해결할 수 있을까요?

$scope.open = function (size) { 
    var modalInstance = $modal.open({ 
    templateUrl: 'myModalContent.html', 
    controller: ModalInstanceCtrl, 
    size: size, 
    resolve: { 
     items: function() { 
     return $scope.items; 
     } 
    } 
    }); 
}; 
}]); 

함수 생성

 $scope.createMedicalServices = function(){ 
    var providerMedicalServiceAttributes = {}; 
    providerMedicalServiceAttributes.cash_price = $scope.cash_price 
    providerMedicalServiceAttributes.average_price = $scope.average_price 
    providerMedicalServiceAttributes.service = $scope.service 
    var medicalServicesAttributes = {}; 
    medicalServicesAttributes.description = $scope.description 
    medicalServicesAttributes.service = $scope.service 
    var newMedicalService = ProviderMedicalService.create(providerMedicalServiceAttributes); 
    $scope.provider_medical_services.push(newMedicalService); 
    ProviderMedicalService.update(providerMedicalServiceAttributes, '/providers/services'); 
}; 

공장에서 기능 (공장 쿼리, 삭제 및 생성 않습니다) 만들

ProviderMedicalService.prototype.create = function(attr){ 
    return this.service.save(attr); 
} 

모달 폼

<div ng-controller="ModalDemoCtrl"> 
<script type="text/ng-template" id="myModalContent.html"> 
    <div class="header-modal"> 
     <h3>Add Service</h3> 
    </div> 
    <div class="modal-body"> 
     <form name="myForm" novalidate ng-submit="submit()"> 
      <div class="row well-text-padding"> 
       <div class="col-md-3 modal-form-tag">CPT Code</div> 
       <div class="col-md-6"> 
        <input type="text" class="form-control form-control-modal" ng-model="CPT_code" placeholder="CPT Code"> 
       </div> 
      </div> 

      <label class="checkbox modal-check-box"> 
       <input type="checkbox" ng-model="No_CPT_code">Service does not have a associated CPT Code 
      </label> 

      <div class="row well-text-padding"> 
       <div class="col-md-3 modal-form-tag">Description</div> 
       <div class="col-md-6"> 
        <textarea class="form-control form-control-modal" rows="3" ng-model="Description" placeholder="Add a Description"></textarea> 
       </div> 
      </div> 

      <div class="row well-text-padding"> 
       <div class="col-md-3 modal-form-tag">Average Cost</div> 
       <div class="col-md-6"> 
        <input type="text" class="form-control form-control-modal" ng-model="Average_cost" placeholder="$"> 
       </div> 
      </div> 

      <div class="row well-text-padding"> 
       <div class="col-md-3 modal-form-tag">Offered Price</div> 
       <div class="col-md-6"> 
        <input type="text" class="form-control form-control-modal" ng-model="Offered_price" placeholder="$"> 
       </div> 
      </div> 

      <div class="btn-row2 modal-button-row"> 
       <button class="btn btn-warning" ng-click="cancel()">Cancel</button> 
       <button class="btn btn-primary" type="submit">Add Service</button> 
      </div> 
</script> 

Answer 1

의 HTML 당신은 Add Service를 클릭하면 서버에 POST 요청을 보내거나 $scope.$close()을 통해 모달의 데이터를 주 컨트롤러로 전달할 수 있습니다. 아래

예 : 모달 컨트롤러에서

var data = { 
    CPT_code: $scope.CPT_code, 
    No_CPT_code: $scope.No_CPT_code, 
    Description: $scope.Description, 
    Average_cost: $scope.Average_cost, 
    Offered_price: $scope.Offered_price 
}; 

$scope.$close(data); // pass the data through modal close event 

다음이 도움이 데이터

$scope.open = function (size) { 
    var modalInstance = $modal.open({ 
    templateUrl: 'myModalContent.html', 
    controller: ModalInstanceCtrl, 
    size: size, 
    resolve: { 
     items: function() { 
      return $scope.items; 
     } 
    } 
    }).result.then(function (response) { 
    var data = response; // here is your data from your modal 
    }); 
}; 

희망을 얻을 수있는 약속을 사용하여 메인 컨트롤러이다.