Cannot read property '$$phase' of null at Object.$$debounceViewValueCommit - angularjs

Question

I am getting this error while moving from one page to another. I have add order page with forms if I go to add order page directly it works fine but if go orders list page and then go to add order page then i got this error and all my forms fields on add order page set touched automatically . what could be the issue please help . thanks in advance
here is my home.html code
<div class="container body" ng-cloak>
<div class="main_container">
<div class="col-md-3 left_col">
<div class="left_col scroll-view">
<div class="navbar nav_title" style="border: 0;">
<img src="../assets/images/logo1.PNG" style="width:25%; float:left;"/>
<span>Trackerist</span>
</div>
<div class="clearfix"></div>
<!-- menu profile quick info -->
<div class="profile clearfix padding-2x">
<h5 class="text-center">Welcome</h5>
<h5 class="text-center">{{domain | capitalize}}</h5>
</div>
<!-- /menu profile quick info -->
<!-- sidebar menu -->
<div id="sidebar-menu" class="main_menu_side hidden-print main_menu">
<div class="menu_section">
<!-- <h3>General</h3> -->
<ul class="nav side-menu">
<li><i class="fa fa-dashboard"></i> DASHBOARD
</li>
<li ng-if="is_admin"><a><i class="fa fa-truck"></i> COMPANY <span class="fa fa-chevron-down"></span></a>
<ul class="nav child_menu">
<li><a ui-sref="home.inviteCompany">Invite companies</a></li>
<li><a ui-sref="home.listCompany">List companies</a></li>
</ul>
</li>
<li ng-if="!is_admin">
<a><i class="fa fa-book"></i> ORDERS <span class="fa fa-chevron-down"></span></a>
<ul class="nav child_menu">
<li><a ui-sref="home.orderAdd">Create Order</a></li>
<li><a ui-sref="home.orderListing">List Orders</a></li>
<li><a ui-sref="home.savedOrders">Saved Orders</a></li>
</ul>
</li>
<li ng-if="!is_admin">
<a><i class="fa fa-user"></i> AGENTS <span class="fa fa-chevron-down"></span></a>
<ul class="nav child_menu">
<li><a ui-sref="home.agentAdd">Add Agent</a></li>
<li><a ui-sref="home.agentListing">List Agents</a></li>
</ul>
</li>
<li ng-if="!is_admin">
<a><i class="fa fa-truck"></i> DRIVERS <span class="fa fa-chevron-down"></span></a>
<ul class="nav child_menu">
<li><a ui-sref="home.driverAdd">Add Driver</a></li>
<li><a ui-sref="home.driverListing">List Drivers</a></li>
<li><a ui-sref="home.mapView">Live Map View</a></li>
</ul>
</li>
<li ng-if="!is_admin">
<a><i class="fa fa-archive"></i> WAREHOUSES <span class="fa fa-chevron-down"></span></a>
<ul class="nav child_menu">
<li><a ui-sref="home.warehouseAdd">Add Warehouse</a></li>
<li><a ui-sref="home.warehouseListing">List Warehouses</a></li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- top navigation -->
<div class="top_nav">
<div class="nav_menu">
<nav>
<div class="nav toggle">
<a id="menu_toggle"><i class="fa fa-bars"></i></a>
</div>
<ul class="nav navbar-nav navbar-right" style="display:flex">
<form ng-show="showSearchBar" class="navbar-form" role="search" style="width:80%">
<div class="input-group" style="width:100%">
<input type="text" ng-model="searchText" class="form-control" placeholder="Search">
<span class="input-group-btn" style="width: 10%;" ng-click="showSearchBar=false">
<button type="reset" class="btn btn-default">
<span class="glyphicon glyphicon-remove">
<span class="sr-only">Close</span>
</span>
</button>
</span>
</div>
</form>
<button type="submit" class="btn btn-default" style="width:10%" ng-click="searchIt()">
<span class="glyphicon glyphicon-search">
<span class="sr-only">Search</span>
</span>
</button>
<li class="">
<a href="javascript:;" class="user-profile dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
<i class="glyphicon glyphicon-cog"></i>
</a>
<ul class="dropdown-menu dropdown-usermenu pull-right">
<li> Profile </li>
<li>
<a href="javascript:;">
<span class="badge bg-red pull-right">50%</span>
<span>Settings</span>
</a>
</li>
<li>Help</li>
<li><a ng-click="logout()"><i class="fa fa-sign-out pull-right"></i> Log Out</a></li>
</ul>
</li>
</ul>
</nav>
</div>
</div>
<!-- /top navigation -->
<!-- page content -->
<div class="right_col" role="main" ui-view="">
</div>
<!-- /page content -->
<!-- footer content -->
<footer>
<div class="pull-right">
Copyright Trackerist © 2017. All rights reserved.
</div>
<div class="clearfix"></div>
</footer>
<!-- /footer content -->
</div>
</div>
<script>
$(document).ready(function () {
$.getScript('assets/js/custom.js');
});
</script>
here is my index.html file
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title> Logistics </title>
<!-- Bootstrap core CSS -->
<link href="assets/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/fonts/css/font-awesome.min.css" rel="stylesheet">
<link href="assets/css/animate.min.css" rel="stylesheet">
<link href="assets/vendors/bootstrap-daterangepicker/daterangepicker.css"
rel="stylesheet">
<link href="assets/css/custom.css" rel="stylesheet">
<!-- jQuery -->
<script src="assets/vendors/jquery/dist/jquery.min.js"></script>
<!-- Bootstrap -->
<script src="assets/vendors/bootstrap/dist/js/bootstrap.min.js"></script>
<!-- FastClick -->
<script src="assets/vendors/fastclick/lib/fastclick.js"></script>
<!-- NProgress -->
<script src="assets/vendors/nprogress/nprogress.js"></script>
<!-- Chart.js -->
<script src="assets/vendors/Chart.js/dist/Chart.min.js"></script>
<!-- gauge.js -->
<script src="assets/vendors/gauge.js/dist/gauge.min.js"></script>
<!-- bootstrap-progressbar -->
<script src="assets/vendors/bootstrap-progressbar/bootstrap-
progressbar.min.js"></script>
<!-- iCheck -->
<script src="assets/vendors/iCheck/icheck.min.js"></script>
<!-- Skycons -->
<script src="assets/vendors/skycons/skycons.js"></script>
<!-- Flot -->
<script src="assets/vendors/Flot/jquery.flot.js"></script>
<script src="assets/vendors/Flot/jquery.flot.pie.js"></script>
<script src="assets/vendors/Flot/jquery.flot.time.js"></script>
<script src="assets/vendors/Flot/jquery.flot.stack.js"></script>
<script src="assets/vendors/Flot/jquery.flot.resize.js"></script>
<!-- Flot plugins -->
<script src="assets/vendors/flot.orderbars/js/jquery.flot.orderBars.js"></script>
<script src="assets/vendors/flot-spline/js/jquery.flot.spline.min.js"></script>
<script src="assets/vendors/flot.curvedlines/curvedLines.js"></script>
<!-- DateJS -->
<script src="assets/vendors/DateJS/build/date.js"></script>
<!-- JQVMap -->
<script src="assets/vendors/jqvmap/dist/jquery.vmap.js"></script>
<script src="assets/vendors/jqvmap/dist/maps/jquery.vmap.world.js"></script>
<script src="assets/vendors/jqvmap/examples/js/jquery.vmap.sampledata.js"></script>
<!-- bootstrap-daterangepicker -->
<script src="assets/vendors/moment/min/moment.min.js"></script>
<script src="assets/vendors/bootstrap-daterangepicker/daterangepicker.js"></script>
<!-- Switchery -->
<script src="assets/vendors/switchery/dist/switchery.min.js"></script>
<link href="assets/vendors/switchery/dist/switchery.min.css" rel="stylesheet">
<!-- NProgress -->
<link href="assets/vendors/nprogress/nprogress.css" rel="stylesheet">
<!-- iCheck -->
<link href="assets/vendors/iCheck/skins/flat/green.css" rel="stylesheet">
<!--[if lt IE 9]>
<script src="../assets/js/ie8-responsive-file-warning.js"></script>
<![endif]-->
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<link rel="stylesheet" href="node_modules/angular-material/angular-material.css">
<script src="node_modules/angular/angular.min.js"></script>
<script src="node_modules/angular-ui-router/release/angular-ui-router.min.js"></script>
<script src="node_modules/angular-local-storage/src/angular-local-storage.js"></script>
<script src="node_modules/oclazyload/dist/ocLazyLoad.min.js"></script>
<script src="node_modules/angular-aria/angular-aria.js"></script>
<script src="node_modules/angular-animate/angular-animate.js"></script>
<script src="node_modules/angular-material/angular-material.js"></script>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<!--<script src="node_modules/angular-loading-bar/build/loading-bar.js"></script>-->
<!--<script src="node_modules/angular-loading-bar/build/loading-bar.css"></script>-->
<script src="http://maps.googleapis.com/maps/api/js?
libraries=places&key=AIzaSyDLy0G_2BB47UWc6NwDCqHsrpaRfx2OyR8"></script>
<!--<script src="http://jvandemo.github.io/angularjs-google-maps/dist/angularjs-google-maps.js"></script> -->
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular-cookies.js"></script>
<!--<script src="assets/js/custom.js"></script>-->
<!-- jQuery Smart Wizard -->
<script src="assets/js/jquery.smartWizard.js"></script>
<script src="assets/js/vs-google-autocomplete.js"></script>
<script src="index.js"></script>
<script src="factories/subDomian.js"></script>
</head>
<body ng-app="logistics" class="{{ bodylayout }}">
<ui-view>
</ui-view>
</body>
</html>
there are the routes
.state('home.orderAdd', {
url: "/orders/add",
controller: "orderController",
templateUrl: "views/order/add.html",
resolve: {
loadMyCtrl: ['$ocLazyLoad', function ($ocLazyLoad) {
return $ocLazyLoad.load("controllers/orders.js");
}]
},
authenticate: true
})
.state('home.orderListing', {
url: "/orders/listing",
controller: "orderController",
templateUrl: "views/order/listing.html",
resolve: {
loadMyCtrl: ['$ocLazyLoad', function ($ocLazyLoad) {
return $ocLazyLoad.load("controllers/orders.js");
}]
},
authenticate: true
})
.state('home.orderDetails', {
url: "/orders/details?order_id",
controller: "orderController",
templateUrl: "views/order/details.html",
resolve: {
loadMyCtrl: ['$ocLazyLoad', function ($ocLazyLoad) {
return $ocLazyLoad.load({serie: true,
name: "login",
files:[
"controllers/orders.js",
"node_modules/qrcode-generator/qrcode.js",
"node_modules/qrcode-generator/qrcode_UTF8.js",
"node_modules/angular-qrcode/angular-qrcode.js"
]
});
}]
},
authenticate: true
})
.state('home.savedOrders', {
url: "/orders/savedOrders-listing",
controller: "orderController",
templateUrl: "views/order/saved_listing.html",
resolve: {
loadMyCtrl: ['$ocLazyLoad', function ($ocLazyLoad) {
return $ocLazyLoad.load("controllers/orders.js");
}]
},
authenticate: true
})
.state('home.orderDetail', {
url: "/orders/details/:order_id",
controller: "orderController",
templateUrl: "views/order/add.html",
params: {
'order_id': null,
'order_obj': null,
'type': 'order-details',
},
resolve: {
loadMyCtrl: ['$ocLazyLoad', function ($ocLazyLoad) {
return $ocLazyLoad.load({serie: true,
name: "login",
files:[
"controllers/orders.js",
"node_modules/qrcode-generator/qrcode.js",
"node_modules/qrcode-generator/qrcode_UTF8.js",
"node_modules/angular-qrcode/angular-qrcode.js"
]
});
}]
},
authenticate: true
})
.state('home.orderEdit', {
url: "/orders/edit?order_id",
controller: "orderController",
templateUrl: "views/order/add.html",
params:{
'order_id': null,
'order_obj': null,
'type': 'order-edit',
},
resolve: {
loadMyCtrl: ['$ocLazyLoad', function ($ocLazyLoad) {
return $ocLazyLoad.load("controllers/orders.js");
}]
},
authenticate: true
})
here is my versions
"dependencies": {
"angular": "1.6.6",
"angular-animate": "^1.6.6",
"angular-aria": "^1.6.6",
"angular-jwt": "0.1.9",
"angular-loading-bar": "^0.9.0",
"angular-local-storage": "^0.7.1",
"angular-material": "^1.1.5",
"angular-qrcode": "^7.2.0",
"angular-ui-router": "1.0.3",
"nprogress": "^0.2.0",
"oclazyload": "^1.1.0",
"sweetalert": "^2.0.6",
"vsGoogleAutocomplete": "^0.5.0"
}
cause of error
<div class="right_col ng-scope" role="main" ui-view="" data-ng-animate="1">