Angularjs - Cannot read property 'split' of undefined

Question

I am trying to split the date entered using the text field. I want it in an array.

In html file

<%= text_field_tag :checkoutdate, params[:checkoutdate],:placeholder => 'Select Date', :class=>'form-control datepicker input-lg',:required=>true,"ng-model" => "checkoutdate"%>

    <p class='bg-danger' ng-show="isInvalidDate()">Check-out date cannot be lesser than check-in date</p>

In Controller js file

App.controller('validationController',['$scope', function($scope){
$scope.isInvalidDate = function(){
     var checkin = $scope.checkindate.split('-');
     var checkout = $scope.checkoutdate.split('-');

    if($scope.checkin[0]>$scope.checkout[0] || $scope.checkin[1]>$scope.checkout[1]){
        return true;
    }

}

and i get the error in console

Cannot read property 'split' of undefined

what am i doing wrong?

Answer 1

You are running into dirty checking when the value is not defined yet. Simply check to make sure the value is not undefined before you run your function.

App.controller('validationController', ['$scope',
        function ($scope) {
            $scope.isInvalidDate = function () {
                if($scope.checkindate === undefined || $scope.checkoutdate === undefined){
                    return false;
                }
                var checkin = $scope.checkindate.split('-');
                var checkout = $scope.checkoutdate.split('-');

                if ($scope.checkin[0] > $scope.checkout[0] || $scope.checkin[1] > $scope.checkout[1]) {
                    return true;
                }

            }]);