Menu
I am trying to create my first angular app. But its not working at all. I have no idea what's the problem. I checked the console, but there's no erros.
<head>
<meta charset="utf-8">
<script src="https://code.angularjs.org/1.6.0/angular.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.6.0/angular-route.js"></script>
</head>
<body ng-app="myApp">
<h1>Test angular</h1>
<a href="#/">Main</a>
<a href="#sec">Second</a>
<a href="#th">Third</a>
<div ng-view></div>
</body>
<script>
var app = angular.module("myApp", ["ngRoute"]);
app.config(function($routeProvider) {
$routeProvider
.when("/", {
templateUrl : "main.html"
})
.when("/sec", {
templateUrl : "sec.html"
})
.when("/th", {
templateUrl : "th.html"
});
});
</script>
Can anyone help me?
374
Then you must add the ngRoute as a dependency in the application module: var app = angular. module("myApp", ["ngRoute"]); Now your application has access to the route module, which provides the $routeProvider .
$routeProvider is used to configure the routes. We use the ngRoute config() to configure the $routeProvider. The config() takes a function which takes the $routeProvider as parameter and the routing configuration goes inside the function.
Routing in AngularJS is used when the user wants to navigate to different pages in an application but still wants it to be a single page application. AngularJS routes enable the user to create different URLs for different content in an application.
Finally, load the module in your application by adding it as a dependent module: angular. module('app', ['ngRoute']); With that you're ready to get started! The ngRoute module provides routing and deeplinking services and directives for AngularJS apps.
Routes in Angular 1.6 changed from #/myUrl to #!/myUrl
You should change your ref to:
<a href="#!/">Main</a>
<a href="#!/sec">Second</a>
<a href="#!/th">Third</a>
See this answer if you want to remove this prefix.
196
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
