Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

AngularJS + Base Href Case Sensitive?

I'm struggling to understand why my base href seems to be case sensitive. I have a page with a base href and utilizes angularjs routing.

html:

<html ng-app="app">
    <head>
        <base href="/Foo/"/>
    </head>
    <body>
        <div>Foo</div>
        <div ng-view></div>  
    </body>
</html>

js:

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

module.config(function ($routeProvider, $locationProvider) {
    $routeProvider
        .when('/Home/Page1', { templateUrl = 'partials/page1' })
        .otherwise({ redirectTo: '' });

     $locationProvider.html5Mode(true);
     $locationProvider.hashPrefix('!');
});

If I navigate to http://www.example.com/Foo/, it's fine. But when I navigate to http://www.example.com/foo/ I get an angular error:

Error: Invalid url "http://www.example.com/foo/", missing path prefix "/Foo" !
at Error (<anonymous>)
at Object.LocationUrl.$$parse (http://www.example.com/foo/Scripts/angular.js:4983:13)
at Object.LocationUrl (http://www.example.com/foo/Scripts/angular.js:5014:8)
at $LocationProvider.$get (http://www.example.com/foo/Scripts/angular.js:5387:21)
at Object.invoke (http://www.example.com/foo/Scripts/angular.js:2809:28)
at http://www.example.com/foo/Scripts/angular.js:2647:37
at getService (http://www.example.com/foo/Scripts/angular.js:2769:39)
at Object.invoke (http://www.example.com/foo/Scripts/angular.js:2787:13)
at $CompileProvider.directive (http://www.example.com/foo/Scripts/angular.js:3613:43)
at Array.forEach (native) angular.js:5582

If it helps/makes a difference, site is hosted on IIS and using MVC 4.

like image 925
tris Avatar asked Feb 21 '13 04:02

tris


People also ask

Which makes route path case sensitive in AngularJS?

The routes that are configured using UI-Router are case-sensitive by default.

What is AngularJS used for?

AngularJS is a structural framework for dynamic web apps. It lets you use HTML as your template language and lets you extend HTML's syntax to express your application's components clearly and succinctly. AngularJS's data binding and dependency injection eliminate much of the code you would otherwise have to write.


1 Answers

You need to turn off case sensitivity of angularjs route provider.

Please review the detail of this feature: add caseInsensitiveMatch option for url matching

like image 159
caoxinagkun Avatar answered Oct 08 '22 19:10

caoxinagkun