각도 변수를 사용하여 부트 스트랩 모달 토글

Question

버튼을 사용하여 트리거 된 각도를 학습하기 전에 프로젝트의 부트 스트랩 3 모달을 작성했습니다. 이제 각 변수를 사용하여 토글하고 싶습니다. 다음과 같이 this 기사에서 참조를 촬영, 난 내 코드를 단순화 :

내 모달 HTML :

<div id="registered" tabindex="-1" modal-toggle role="dialog" aria-labelledby="registeredModal" aria-hidden="true" class="modal fade"> 
    <div class="modal-dialog modal-lg"> 
    ... 
    ... 
    </div> 
</div> 

modalToggle 지침 :

app.directive("modalToggle",function(){ 
    return function(scope, element, attrs){ 
    scope.$watch(scope.loaded.showModal, function(value) { 
       if (value) element.modal('show'); 
       else element.modal('hide'); 
    }); 
    } 
}) 

scope.loaded.showModal이 후라고 다음 컨트롤러에 설정되어 양식 입력시 탭 클릭 :

app.controller('validatectrl',[ '$http', '$scope', '$upload', $location, function($http, $scope, $location){ 
     unique: function(param){ 
     $scope.loading={}; 
     $scope.loaded={}; 
     $scope.loading[param.field]=true; 

     var currentPath=$location.path(); 
     var webCall = $http({ 
        method: 'POST', 
        url: currentPath+'/validation', 
        async : true, 
        headers: { 
        'Content-Type': 'application/json' 
        }, 
        timeout:10000, 
        data: param}); 
     webCall.then(handleSuccess,handleError); 
     function handleSuccess(response) { 
      ... 
      if(response.data.status===1) { 
      ... 
      } 
      else if(response.data.status===0){ 
      $scope.loaded["showModal"]=true; 
      alert("duplicate item"); 
      } 
     } 
     function handleError(response){ 
      $scope.loaded[param.field]={}; 
      $scope.loading[param.field]=false; 
      $scope.loaded[param.field]["error"]=true; 
      $scope.loaded[param.field]["Message"]="Cannot fetch data from server"; 
     }; 
     } 

모달을 제외하고 다른 모든 것이 작동하지 않습니다.

Answer 1

당신은

scope.$watch(scope.loaded.showModal, function(value) { 
      if (value) element.modal('show'); 
      else element.modal('hide'); 
}); 

에서

scope.$watch(function(){ return scope.loaded.showModal; }, function(value) { 
      if (value) element.modal('show'); 
      else element.modal('hide'); 
}); 

희망이 도움말을 변경하려고 할 수 있습니다.