Как убедиться, что у клиентов достаточно текста в textarea, используя angularjs для отключения / включения кнопки?

Question

Я пытаюсь включить кнопку, если клиент вводит определенное количество слов, но отключить ее, если их количество слов не встречается.

Я начал с использования длины символов вместо слов с использованием условия «если» и «еще», но не смог получить желаемый результат. Я использовал «ng-model» в элементе textarea, но каждый раз, когда я обновляю страницу, он всегда имеет «true» или «false» в уже набранном текстовом поле, и когда я его удаляю, он всегда включает кнопку. И когда я ввожу один символ в текстовой области, кнопка отключается.

<span ng-controller="pract">
   <textarea id="blogVal" ng-model="btnChange" placeholder="Share"> 
   </textarea>
   <button ng-disabled="btnChange" class="btnpost">Post</button>
</span>

var app = angular.module("app", []);
app.controller("pract", ($scope) => {    
    $scope.clientValLength = document.getElementById("blogVal").value.length;
    if ($scope.clientValLength <= 7) {
        $scope.btnChange = true;
    } else {
        $scope.btnChange = false;
    }
});

Answer 1

Возможно, вы захотите посмотреть на ng-change.Когда происходит изменение значения, запускается функция, используемая в ng-change.Там вы можете выполнять свои проверки.

Из вашего кода кажется, что вы меняете значение $scope.btnChange на true или false.Это повлияет на ваше значение textarea.

И не рекомендуется использовать vanilla javascript для извлечения значений из DOM.Поэтому старайтесь избегать document.getElementById("blogVal")

<textarea id="blogVal" ng-model="textAreaValue" ng-change="textChange()" placeholder="Share"></textarea>
<button ng-disabled="btnChange" class="btnpost">Post</button>

$scope.textChange(){
    if ($scope.textAreaValue.split(' ').length<= 7) {
        $scope.btnChange = true;
    } else {
        $scope.btnChange = false;
    }
}