1

Каким будет лучший способ сохранить кнопку «Сохранить», чтобы ввести действующий текст инструкции? Я попытался использовать ng-disable на кнопке «Сохранить», но активируется, как только я помещу что-то в поле ввода.Кнопка отключения при вводе данных отсутствует в базе данных

HTML

<div class="row" ng-init="initUpsert()"> 
    <div class="input-field col m4"> 
    <label class="active" for="instructionText">Instruction Text</label> 
    <autocomplete 
     ng-if="!currentQuestion.id || currentQuestion.status === 'flagged'" 
     ng-model="currentQuestion.Instruction.instructionText" 
     data="instructionChoices" 
     attr-placeholder="Instruction Text" 
     attr-input-class="validate" 
     attr=id="instructionText" 
     on-type="getRemoteInstructions" 
     on-select="checkInstructionText" 
     autocomplete-required="true"></autocomplete> 
    <input ng-if="currentQuestion.id && currentQuestion.status !== 'flagged'" type="text" ng-model="currentQuestion.Instruction.instructionText" ng-disabled="true"> 
    </div> 
    <button class="modal-action waves-effect btn waves-green teal white-text btn-flat" ng-click="spellcheck(true)" ng-show="currentQuestion.status === 'review' && isModified === true"> 
    Save and Add Another 
    </button> 

    <button class="modal-action waves-effect btn waves-green teal white-text btn-flat" ng-click="spellcheck(false)" ng-show="currentQuestion.status === 'review' && isModified === true" ng-disable="invalidInstructionText"> 
     Save 
    </button> 

    </div> 
    <ng-include src="'/views/modals/spellCheckModal.html'"></ng-include> 
</div> 

Контроллер

$scope.checkInstructionText = function(instruction) { 
    $scope.validInstructionText = true; 
    $http.get("/api/instructions?searchInstructionText=" + instruction).then(function(response) { 
    if (instruction = response.data) { 
     window.alert ("You've selected a valid instruction text"); 
     return $scope.validInstructionText = false; 
    } 
    else { 
     console.log("disable the save buttons"); 
     return $scope.validInstructionText = true; 
    } 
    }); 
}; 

ответ

1

Существует опечатка в кнопке 'Сохранить': Вы писали ng-disable вместо ng-disabled. Он должен работать после исправления, так как вы обновляете значение $scope.validInstructionText в своем обратном вызове http.

Когда-нибудь вещь (я не знаю, возможно ли это в вашем случае, но ...): Я думаю, что было бы хорошо избежать вызова сервера (т. Е. Http-запроса) каждый раз, когда пользователь хочет сохранить. Вы можете сделать вызов только один раз за сценой (например, на контроллере init), сохранить результат в области $ scope, а затем использовать его для проверки. Так было бы быстрее.

Кроме того, ваша директива ngDisabled ввода ищет выражение $scope.true, а не логическое значение true. Поскольку $scope.true не определено, он оценивается как falsy, поэтому вы никогда не сможете его отключить. В Угловых документах есть дополнительная информация о ngDisabled, если вам это нужно.

+0

спасибо !! Я получил его на работу, я переместил $ scope.validInstructionText = true за пределами функции, после чего я изменил ng-disable на ng-disabled. – Jason

0
ng-click="invalidInstructionText? spellcheck(false) : return" 

попробовать что