I am new to Angular JS.My first question how to understand the error messages from console in Angular JS. I have written this snippet of code for matching passwords. It throws error on console, But it works fine.Its wired. I am not able to understand anything from those console messages. Could anyone please point me out why I am getting error message on console.
var sampleApp = angular.module("sampleApp",[]);
sampleApp.controller('sampleCtrl', ['$scope', function($scope){
}]);
sampleApp.directive('pwCheck', [function(){
// Runs during compile
return {
require: 'ngModel', // Array = multiple requires, ? = optional, ^ = check parent elements
link: function($scope, iElm, iAttrs, controller) {
var password1 = iAttrs.ngModel;
var password2 = iAttrs.pwCheck;
$scope.$watch('[password1, password2]', function(newValue, oldValue){
controller.$setValidity('pwmatch', $scope[password1] === $scope[password2] );
});
}
};
}]);<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<html ng-app="sampleApp">
<head>
</head>
<body ng-controller="sampleCtrl">
<form name="myForm">
<label for="pw1">Set a password:</label><br />
<input type="password" id="pw1" name="pw1" ng-model="pw1" /><br />
<label for="pw2">Confirm the password:</label><br />
<input type="password" id="pw2" name="pw2" ng-model="pw2" pw-check="pw1" />
<div class="msg-block" ng-show="myForm.$error">
<span class="msg-error" ng-show="myForm.pw2.$error.pwmatch">Passwords don't match.</span>
</div>
</form>
</body>
</html>Is there any easy way/tool to debug Angular JS code, As I am facing a lot of difficulty in understanding the console error messages.
Screenshot of console:
