CODEWITHSUNDEEP
angularjshtmlangularjs-directive
Marco Santos
Marco Santos

Reputation: 1005

Capture value from Input field

I'm trying to get the value from one of the input fields in my form, but my code isn't working:

JavaScript:

angular
    .module('myDirectives')
    .directive('pwMatch', matchPassword);

function matchPassword() {
    return {
        restrict: 'A',
        require: 'ngModel',
        link: function (scope, element, attrs, ngModelCtrl) {
            var modelIt = attrs.pwMatch;
            var inputValue = attrs.modelIt;
            console.log(inputValue);
        }
    };
};

HTML:

<input name="telephone" type="number" value="223344455">
<div pw-match="form.telephone"></div>

Upvotes: 0

Views: 477

Answers (2)

georgeawg
georgeawg

Reputation: 48968

If you are trying to get the value of an input, use ng-model.

<input ng-model="form.telephone" type="number" value="223344455">
<div pw-match input-name="form.telephone"></div>

And if you want to get that value in a directive using a name on an attribute, use the$watch method on the scope.

JS

angular.module('myDirectives',[])
.directive('pwMatch', function() {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            scope.$watch(attrs.inputName, function(value) (
                var inputValue = value;
                console.log(inputValue);
            };
        }
    }
});

Upvotes: 1

Ben Aubin
Ben Aubin

Reputation: 5657

 .module('myDirectives')

needs to be

 .module('myDirectives', [])

Even though you have no dependencies, you have to have the empty array.

Also, it's a really bad idea™ to use a variable function as a directive or something, it's just going to confuse you.

This works, too, and might make your application a bit easier to maintain:

angular.module('myDirectives', [])
.directive('pwMatch', function() {
    return {
        restrict: 'A',
        require: 'ngModel',
        link: function (scope, element, attrs, ngModelCtrl) {
            var modelIt = attrs.pwMatch;
            var inputValue = attrs.modelIt;
            console.log(inputValue);
        }
    }
});

Upvotes: 0

Related Questions