$route: This is used for deep-linking URLs to controllers and views (HTML partials) and watches $location.url() in order to map the path from an existing definition of route.

When we use ngRoute, the route is configured with $routeProvider and when we use ui-router, the route is configured with $stateProvider and $urlRouterProvider.

ngRoute - It is a part of AngularJs and was developed by Angular.js team.

Syntax:

<div ng-view></div>
    $routeProvider
        .when('/contact/', {
            templateUrl: 'app/views/core/contact/contact.html',
            controller: 'ContactCtrl'
        });

ui-router - It is used to enhance and to improve the capabilities of routing, It is basically a framework.

Syntax:

<div ui-view>
    <div ui-view='abc'></div>
    <div ui-view='abc'></div>
   </div>
    $stateProvider
        .state("contact", {
            url: "/contact/",
            templateUrl: '/app/Aisel/Contact/views/contact.html',
            controller: 'ContactCtrl'
        });

ui-router supports everything the normal ngRoute has as well as many extra functions.

There are some powerful reasons to use ui-router over ngRoute:

1. It is used for large application where the user have many pages and that are inheriting from different section. So ui-router is used for the nesting views.
2. It allows the user to have a strong linking between the state. So on changing the url in a particular place, it will update every link to that state.
3. User can also pass information between states with the help of $stateParams.