I have a application running at www.xyz.com/platform/
and here is my routing config in angular:
var app = angular.module('coreApp',['ngRoute']);
app.config(['$routeProvider',function($routeProvider){
$routeProvider.when('/platform/dashboard',{
templateUrl: '/partials/dashboard.html'
}).otherwise({redirectTo: '/platform/dashboard'});
}]);
I expect that as soon as the application is opened the URL should change to www.xyz.com/platform/#dashboard and the template be loaded. But template never gets loaded. Neither I get any error in console.
This works however, if I try to run this at xyz.com without the trailing /platform.
Related
I am trying to add angular roue configuration to spring boots java application. urls are working well. bu problem is when i click back button or page refresh, there is an error. error said 'Whitelabel Error Page
This application has no explicit mapping for /error, so you are seeing this as a fallback'. how to config server angular route with spring boot.
my route configurations
var app = angular.module('myApp',['ngTable','jcs-autoValidate','ngRoute']);
// configure our routes
app.config(function($routeProvider,$locationProvider) {
$routeProvider
.when('/test', {
templateUrl : 'template.jsp'
})
.when('/ct', {
templateUrl : 'ct.jsp',
controller : 'myCtrl'
})
.when('/qa', {
templateUrl : 'qa.jsp',
controller : 'ourCon'
})
$locationProvider.html5Mode(true);
});
my menu
CT
QA
how to solve this issue.
I am using ngRoute to my application. problem is when i reload that page, there is an error.
error said
Whitelabel Error Page
This application has no explicit mapping for /error, so you are seeing this as a fallback.
var app = angular.module('myApp',['ngTable','jcs-autoValidate','ngRoute']);
// configure our routes
app.config(function($routeProvider,$locationProvider) {
$routeProvider
.when('/container-details', {
templateUrl : 'container-details-test.jsp',
controller : 'myCtrl'
})
$locationProvider.html5Mode(true);
});
You'll need to configure your server based off the guidelines on this page:
https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions#how-to-configure-your-server-to-work-with-html5mode
How to handle page reload in AngularJS app for URL that doesn't exist in Laravel routes
I don't know how to bump but I have the exact same problem as this guy and looks like his question didn't get answered.
I'm using angular 1.4.8 and laravel 5.2.
If I load the page "home.php" it works(shows home content and "main" content).
I press a link to open home/info and it works and I see the info page loaded with angular routes.
Now if I refresh this I get an error(Not found exception).
How can I fix this in laravel?
My angular routes for home.php:
app.config(function($routeProvider, $locationProvider) {
$locationProvider.html5Mode(true).hashPrefix('!');
$routeProvider
.when('/', {
templateUrl : '/main'
})
.when('/info', {
templateUrl : '/info'
});
});`
Laravel routes:
Route::get('home', function () {
return view('home');
});
Route::get('main', function () {
return view('main');
});
Route::get('info', function () {
return view('info');
});
So what's not working: I can't go directly to home/info(or refresh it). I can only go to home, then press link to home/info to see it. It should load home page with info page loaded(with angular routes).
I'm developing a web application using ASP.NET MVC and AngularJS with ngRoute module. The configuration works fine but URLs contain #/ and I would like to remove them. I know the point is adding $locationProvider.html5Mode(true); and <base href="/"> in the <head> but there is some conflict with server side routing and I can't get it work.
This is the route provider
$routeProvider
.when("/", {
templateUrl: "Home/Phones",
controller: "firstController"
})
.when("/phone", {
templateUrl: "Home/Phone",
controller: "secondController"
})
Pages can be normally accessed through http://localhost/test/#/ and http://localhost/test/#/phone.
Now if I add $locationProvider.html5Mode(true); and <base href="test"> in the header section of index page I can access the default page at http://localhost/test/ but the page is empty. Trying to access and I get an error at http://localhost/test/phone fires 404 page not found.
So... how to solve the first problem? Console doesn't show any error, don't know what to try...
I guess I should at least change my RouteConfig.cs, not it contains the default
routes.MapRoute(
name: "Default",
url: "{controller}/{action}/{id}",
defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
);
The browser is requesting an asset /test/phone but that doesnt exist. In the case of 404s within a Single Page App using html5Mode you need to configure your webserver to serve the index.html on all "404"s
I try change build-in Angular route mechanism to ui.router. So I included angular.ui.router.js to my index.html and to my module:
var app = angular.module('multibookWeb', ['ui.router']);
Next I set routing in app.config:
$urlRouterProvider.otherwise('/list');
$stateProvider
.state('list', {
url: '/list',
templateUrl: '/partials/list/list.html',
});
Console don't show any errors, but routing doesn't work. I fired www.someAddress.com/# and I expect that my routing redirects me to www.someAddress.com/#/list or something like this. Unfortunately it doesn't happend. When I console (inside $watch) value of $state.current.name it return me empty string. I tried debugging by this, but console is still empty...
My Angular version: 1.2.28
My Ui.router version: 0.2.13
Here is plunker
The problem is, you have no ui-view.
For the ui-router to function you will need an ui-view. Replace your ng-view with ui-view and it will work.