각도 모달이 결과에서 $ scope를 업데이트하지 않습니다.

Question

사용자에게 입력을 요구하는 모달 윈도우를 구현하려고합니다. 이전 앱에서 거의 동일한 코드를 사용했는데 작동했습니다. 이제

.controller('addStreamModal', [ 
    '$scope', '$modal', '$log', '$http', '$rootScope' 
    ($scope, $modal, $log, $http, $rootScope) -> 
     $scope.open = -> 
      modalInstance = $modal.open(
       templateUrl: "addStream.html" 
       controller: 'addStreamModalInstance' 
       resolve: 
        public_key: -> 
         "placeholder" 
      ) 
      modalInstance.result.then ((result) -> 
       return 
      ), -> 
       $log.info "Modal dismissed at: " + new Date() 
       return 
      return 
     return 
]) 

모달 인스턴스 컨트롤러 : 'T는 여기

이 (커피 스크립트에서) 모달를 여는 컨트롤러입니다 ... 여기에 무슨 일이 일어나고 있는지 알고

.controller('addStreamModalInstance', [ 
    '$scope', '$modalInstance', '$http', 'public_key' 
    ($scope, $modalInstance, $http, public_key) -> 
     console.log(public_key) 
     $scope.public_key = public_key 
     $scope.ok = -> 
      console.log($scope.public_key) 
      $modalInstance.close $scope 
      return 
     $scope.cancel = -> 
      $modalInstance.dismiss "cancel" 
      return 
     return 
]) 

그리고 HTML :

<div class="modal-header"> 
    <h4>Please enter the private key for verification {{public_key}}</h4> 
</div> 
<div class="modal-body"> 
    <div class="form-group"> 
     <input type="text" class="form-control" id="exampleInputEmail1" ng-model="public_key"> 
    </div> 
</div> 
<div class="modal-footer"> 
    <button class="btn btn-primary" ng-click="ok()">OK</button> 
    <button class="btn btn-warning" ng-click="cancel()">Cancel</button> 
</div> 

버튼을 클릭하고 텍스트 상자에 "자리 표시 자"가있는 모달이 열리면이 테스트가 모달 제목에 바인딩 된 것을 볼 수 있습니다. 상자에 텍스트를 끝내면 제목이 바인딩으로 인해 예상대로 업데이트되지만 확인을 클릭하면 $ scope.public_key가 "자리 표시 자"로 되돌아갑니다. 이유를 알아 내려고하는 중입니다.

Answer 1

당신은 당신이 ($ 범위를 반환하여 당신이 일을) 선택한 값을 반환 할 수 있습니다 addStreamModalInstance에서 설정 한 값과 addStreamModal의 범위를 업데이트하려면 당신이 addStreamModal.는 다른 범위 내에서 작업하는 사용자의 addStreamModalInstance 컨트롤러의 값을 설정하는 경우 귀하의 addStreamModal 컨트롤러 호출에 할당하십시오.

귀하의 addStreamModal은 같은 (죄송합니다, 내 커피 스크립트가 잘되지 않습니다) 될 것입니다 :

.controller('addStreamModal', [ 
    '$scope', '$modal', '$log', '$http', '$rootScope' 
    ($scope, $modal, $log, $http, $rootScope) -> 
     $scope.modalTitle = "placeholder" //defaults this value to placeholder 
     $scope.open = -> 
      modalInstance = $modal.open(
       templateUrl: "addStream.html" 
       controller: 'addStreamModalInstance' 
       resolve: 
        public_key: -> 
         $scope.modalTitle 
      ) 
      modalInstance.result.then ((modalScope) -> 
       $scope.modalTitle = modalScope.public_key //updates the default value with the value from the modal 
       return 
      ), -> 
       $log.info "Modal dismissed at: " + new Date() 
       return 
      return 
     return 
]) 

Answer 2

좋아 나는 천천히에 적응 한 다음 테스트 지금 일하고, 내가 다시 각도 예에갔습니다 내 요구를 heres 코드 :

.controller "addStreamModal", ($scope, $modal, $http, $log) -> 
    $scope.public_key = "" 
    $scope.open = -> 
     modalInstance = $modal.open(
      templateUrl: "addStream.html" 
      controller: "addStreamModalInstance" 
      resolve: 
       public_key: -> 
        $scope.public_key 
     ) 
     modalInstance.result.then ((public_key) -> 
      console.log(public_key) 
      return 
     ), -> 
      $log.info "Modal dismissed at: " + new Date() 
      return 
     return 
    return 

그리고 예 :

.controller "addStreamModalInstance", ($scope, $modalInstance, public_key) -> 
    $scope.editable = public_key: public_key 
    $scope.ok = -> 
     $modalInstance.close $scope.editable.public_key 
     return 

    $scope.cancel = -> 
     $modalInstance.dismiss "cancel" 
     return 
    return 

HTML :

<div class="modal-header"> 
    <h3 class="modal-title">I'm a modal!</h3> 
</div> 
<div class="modal-body"> 
    <input type="text" name="input" class="form-control" ng-model="editable.public_key"> 
</div> 
<div class="modal-footer"> 
    <button class="btn btn-primary" ng-click="ok()">OK</button> 
    <button class="btn btn-warning" ng-click="cancel()">Cancel</button> 
</div> 

그래서 내가의 차이라고 생각 는 I 둥지를 인스턴스 컨트롤러의 .editable 객체로 공개 키입니다. 나는 이것이 왜 효과가 있는지는 정확히 이해하지 못한다. 그렇지만 나는 그것에 만족한다.