ngRoute does not work

Asked

Viewed 358 times

1

I was trying to use ngRoute, but I enter the link '/new', an error appears that there is that URL and when I enter the normal '/', it shows nothing.

The index.html:

<html ng-app="starter">
<head>
    <title>App</title>      
    <link rel="icon" href="m/src/logo.ico" type="image/x-icon">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta content="width=device-width" initial-scale="1.0" maximum-scale="1.0" user-scalable="0" name="viewport">
    <meta name="viewport" content="width=device-width">
    <script type="javascript/text" src="m/lib/angular.js"></script>
    <script type="javascript/text" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.4/angular-route.min.js"></script>
    <script type="javascript/text" src="m/js/app.js"></script>
    <script type="javascript/text" src="m/js/controller.js"></script>   
</head>

<body>
    <div ng-view></div>
</body>

The app.js

var app = angular.module("starter", ["ngRoute"]);

app.config(function ($routeProvider, $locationProvider) {

    $locationProvider.html5Mode(true);

    $routeProvider
        .when("/", {
            templateUrl: "templates/main.html"
        })
        .when("/new", {
            templateUrl: "templates/news.html"
        })
        .otherwise({
            redirectTo: "/"
        });
});
angularjs

1 answer

0


You are configuring Angular to use HTML5 mode:

$locationProvider.html5Mode(true);

You then need to set the value of base in the header of your page - for example:

<head>
    <base href="/">
</head>

And also don’t forget that you’ll need to map the target Urls to the base, and this will depend on the type of server you’re using. In IIS, for example, you can use Urlrewrite.

Browser other questions tagged angularjs

You are not signed in. Login or sign up in order to post.