oninput not working in Angular. Alternative?

Christian Hill picture Christian Hill · Apr 8, 2016 · Viewed 14.7k times · Source

Im trying to create a function that reads the value of an input and triggers a series of true/false, however the code below keeps returning "passStrength is not defined." From what I can find, oninput isn't supported by Angular. How can achieve this in Angular?

Within my controller:

$scope.passStrength = function(input) {
    if (input.value.toLowerCase().indexOf(/[a-z]/) > -1) {
        $scope.lwrChar = true;
        console.log('lower ' + $scope.lwrChar);
    } else if (input.value.toUpperCase().indexOf(/[A-Z]/) > -1) {
        $scope.uprChar = true;
        console.log('upper ' + $scope.uprChar);
    } else if (input.value.indexOf() == !isNaN(n)) {
        $scope.nbrChar = true;
        console.log('number ' + $scope.nbrChar);
    } else if (input.value.length >= 8) {
        $scope.countChar = true;
        console.log('count ' + $scope.countChar);
    }
};

and in my markup:

<input id="password" oninput="passStrength()" />

Answer

tpsilva picture tpsilva · Apr 8, 2016

To fire an event when the input changes, use ng-change. Also, you must define a ng-model.

<input ng-model="password" ng-change="passStrength(password)" />

Edit: Created a plunker demonstrating it