2014-06-11 5 views
1

버튼을 동적으로 사용 중지하는 데 문제가 있습니다.제출시 AngularJS 비활성화 버튼 - 오류시 다시 활성화

내 API가 초 저속 연결을 시뮬레이트하기 위해 2 초 동안 휴면 상태가되며 전송할 때 제출 버튼이 비활성화 된 것으로 예상되어 다시 활성화됩니다.

HTML - 수동

<button data-ng-disabled="false" data-ng-click="submit()">Schedule Appointment</button> 

HTML은 ... 버튼이 작동 해제 -이 작동하지 않습니다

<button data-ng-disabled="{{ isSaving }}" data-ng-click="submit()">Schedule Appointment</button> 

컨트롤러 :

app.controller('ScheduleController', function ($scope, $http, $window, $timeout) 
{ 
    $scope.formData = {}; 
    $scope.isSaving = false; 

    $scope.submit = function() { 
     $scope.isSaving = true; 
     console.log('Schedule Appointment Pressed, isSaving', $scope.isSaving); 

     $http.post('/api/v1/schedule/', $scope.formData) 
     .success(function(data) { 
      // Do Stuff 
     }) 
     .error(function(data){ 
      $scope.isSaving = false; 
      console.log('Error, isSaving', $scope.isSaving); 
      $scope.errors = data.errors; 
     }); 
    } 
}); 

모든 것이 완벽하게 작동하고, console.log 출력은 올바르게 저장됩니다. 문제는 HTML에 ng-disabled = "true"를 하드 코드하지 않으면 버튼이 실제로 비활성화되지 않는다는 것입니다.

+3

'data-ng-disabled = "{{isSaving}}"''data-ng-disabled = "isSaving"을 사용하려고 시도합니다. " –

+0

@BogdanSavluk - 그거 쉽지! 그것은 작동합니다 ... 정말 고마워요! '{{}} '을 사용해야 할 때와 사용하지 않을 때는 어떻게 알 수 있습니까? – Gravy

+0

필수 인수 유형에 따라 다르며, 'ng-disabled'의 경우 범위에서 평가되는 표현식입니다. 예를 들어,'ng-href' 지시어는 범위를 사용하여 보간 될 템플릿을 필요로합니다.이 경우 인수는'{{}}' –

답변

0

문제는 HTML에 있습니다. ng 지시문에서 범위 변수에 액세스하는 동안 {{}}이 필요하지 않습니다.

<button ng-disabled="isSaving" ng-click="submit()">Schedule Appointment</button> 

희망이 있습니다.

관련 문제