How To Navigate To Another Page With ngRoute

My Index.html

<!DOCTYPE html>
<html>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular-route.js"></script>
<script src="client/delljson.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">

<body ng-app="myApp" ng-controller="myCtrl" style="background-color:orange;">

<h1><marquee width="40%" direction="right" >Resume</marquee></h1>

<a href='#!/main'>Press</a>

<div ng-view>

</div>

</body>
</html>

My Main.html

<div class="row">
   <div class="col-md-4">
        <h2><u>Personal Information</u></h2>
        <p>{{deljson.personalInformation.name}}</p>
        <p>{{deljson.personalInformation.dob}}</p>
        <p>{{deljson.personalInformation.fatherName}}</p> 
        <p>{{deljson.personalInformation.gender}}</p>
        <p>{{deljson.personalInformation.nationality}}</p>
        <p>{{deljson.personalInformation.maritalStatus}}</p>
   </div>
<div class="col-md-4">
    <h3><u>Educational Information</u></h3>
    <h4><u>SSLC</u></h4>
    <p>{{deljson.educationInformation.sslc.institueName}}</p>
    <p>{{deljson.educationInformation.sslc.studyBoard}}</p>
    <p>{{deljson.educationInformation.sslc.percentage}}</p>
    <p>{{deljson.educationInformation.sslc.yearOfPassedout}}</p>
    <h4><u>HSC</u></h4>
    <p>{{deljson.educationInformation.hsc.institueName}}</p>
    <p>{{deljson.educationInformation.hsc.studyBoard}}</p>
    <p>{{deljson.educationInformation.hsc.percentage}}</p>
    <p>{{deljson.educationInformation.hsc.yearOfPassedout}}</p>
    <h4><u>UG</u></h4>
    <p>{{deljson.educationInformation.ug.institueName}}</p>
    <p>{{deljson.educationInformation.ug.studyBoard}}</p>
    <p>{{deljson.educationInformation.ug.percentage}}</p>
    <p>{{deljson.educationInformation.ug.yearOfPassedout}}</p>
</div>
<div class="col-md-4">
    <h3><u>Work Experience</u></h3>
    <p>{{deljson.experience.previousExperience.companyName}}</p>
    <p>{{deljson.experience.previousExperience.Position}}</p>
    <p>{{deljson.experience.previousExperience.period}}</p>
    <p>{{deljson.experience.previousExperience.responsibility}}</p>
</div>
</div>

My Js and Json File

var app = angular.module('myApp', ['ngRoute']);

app.config(['$routeProvider', function($routeProvider) {
    $routeProvider.when('/main', {
        templateUrl : 'main.html',
        controller : 'first'
    })
   }]);

app.controller('first', ['$scope', '$locationProvider', function($scope){
    $location.path("/main.html" );
}]);

app.controller('myCtrl', function($scope) {
$scope.deljson = {
    "personalInformation": {
        "name": "Raaj Kumar",
        "dob": "13/5/1994",
        "fatherName": "Suresh",
        "gender": "Male",
        "nationality": "Indian",
        "maritalStatus": "Single"
    },
    "educationInformation": {
        "sslc": {
            "institueName": "G.K.S.V.V.J.C",
            "studyBoard": "CBSE",
            "percentage": "45%",
            "yearOfPassedout": "2009"
        },
        "hsc": {
            "institueName": "S.V.M.H.S.S",
            "studyBoard": "Matriculation",
            "percentage": "55%",
            "yearOfPassedout": "2011"
        },
        "ug": {
            "institueName": "S.T. Peter'S Engineering College",
            "course": "B.Tech (It)",
            "percentage": "59%",
            "yearOfPassedout": "2016"
        }
    },
    "experience": {
        "previousExperience": {
            "companyName": "Purple Soft Technology",
            "Position": "SEO Analyst",
            "period": "2018-19",
            "responsibility": "SEO"
        }
    },
    "personalSkills": [
        "Gaming"
    ],
    "technicalSkills": [
        "Digital Marketing",
        "HTML",
        "CSS",
        "JS"
    ]
}
});

The Objective is to make a anchor text and link the main ,html to it and when clicked it should display the main.html in my ng-view.

I tried many methods watching the you tube but its not working out. the ng-view is displaying a template but its not displaying an template url.

Source: AngularJS