2014-12-19 6 views
1

У меня есть директива, которая служит формой кредитной карты. В этой форме могут быть разные кнопки отправки. Во время покупки, который является асинхронным, я должен убедиться, что кнопки отключены. Поэтому я использую простой шаблон наблюдателя для этого. Проблема, с которой я сталкиваюсь, заключается в том, что когда пользователь нажимает кнопку, шаблон наблюдателя работает нормально, изолированный атрибут области, контролирующий ng-disable, устанавливается правильно, однако отключенный не применяется к кнопкам. Я думаю, что это может быть приоритетной задачей?кнопка внутри директива не отключена

Таким образом, она является наблюдателем. Субъект довольно мирский. Просто проверяет форму и имеет список ее наблюдателей. Вот где у меня проблемы.

.directive('submitCardButton', ['$q', function ($q) { 
    return { 
    restrict: 'E', 
    require: '^createCard', 
    scope: { 
     successBack: '&', 
     buttonVal: '@' 
    }, 
    template: "<button class='button button-pink full-width small-top' ng-class=\"{disabled: submitting}\" ng-click='getCC()' ng-disabled=\"submitting\">{+ submitting +} {+ buttonVal +}</button>", 
    link: function (scope, elem, attr, card) { 
     card.registerButton(scope); 
     scope.submitting = false; 

     function getCC() { 
     card.disableButtons(); 
     card.getCC().then(function (response) { 
      $q.when(scope.successBack({response:response})) 
       .finally(card.enableButtons); 
     }, function() { 
      card.enableButtons(); 
     }); 
     } 

     scope.disable = function() { 
     scope.submitting = true; 
     console.log(scope.submitting); 
     }; 

     scope.enable = function() { 
     scope.submitting = false; 
     console.log(scope.submitting); 
     }; 

     scope.getCC = getCC; 
    } // end link 
    };// end return 
}])// end directive 

Когда я отладка, внутри getCC, после того, как я называю disableButtons подавшего заявку устанавливается истина. Howerver подача внутри шаблона все еще ложна и поэтому не отключена. Любая помощь будет столь высоко оценена.

Я создал plunkr, который демонстрирует проблему, с которой я сталкиваюсь. Я использую простую фамилию имени пользователя, чтобы показать проблему. Он отлично работает, если вы подчиняетесь должным образом. Однако, если вы просто отправляете без ввода каких-либо данных, вы можете видеть, что флаг отправки в директиве кнопки установлен в значение True, но отключенный не устанавливается должным образом. http://plnkr.co/edit/8KTUCNMPBRAFVl1N4nXp?p=preview

+0

Я не понимаю - вы называете 'card.disableButtons()' - что он делает? Это кажется критическим для вопроса, но код для этого отсутствует. –

+0

Я добавил плунжер. Он отлично работает, если вы отправляете доброе имя, однако, если вы отправляете плохое имя, флаг «отправка» установлен в значение «истина», но отключенный не устанавливается на кнопках. Вы можете увидеть это, если вы откроете консоль и посмотрите на нее. – user2734679

ответ

2

В вашем createCard.getCC() положительном случае возвращает неразрешенное обещание (это разрешенное позже с $timeout), поэтому в то время как обещание неразрешенное, submitting свойства сферы submitCardButton является «истинным» и кнопка отключена.

В отрицательном случае обещание отклоняется сразу (синхронно), и поэтому нет времени, чтобы кнопка была отключена - обработчик отклонения обещаний устанавливает submitting немедленно на false.

Если вы хотите, чтобы увидеть эффект, изменить негативный случай использования для этого:

if (!(user.firstname && user.lastname)) { 
    $timeout(function() { 
    defer.reject('bad user! bad!'); 
    }, 5000); 
} 
+0

Это решение проблемы. Но для меня лишний тайм-аут кажется мне глупым. Есть ли образец, когда ваши обещания могут быть синхронизированы или асинхронны? – user2734679

+0

Конечно, это глупо - я думал, что это какой-то макет. Вы хотите отключить кнопки на неопределенное время? –

+0

В реальном приложении они могут выбрать из списка возвращаемых объектов, чтобы он немедленно разрешал, или мы попали в api, чтобы сделать пользователя, и он может быть отклонен, или он не пройдет мимо чиста, который он немедленно отклонит. В любом из этих состояний возврата кнопки должны быть повторно подключены. Таким образом, он довольно прикован к реальному приложению. – user2734679

Смежные вопросы