We Keep Coding

Angular routing otherwise

I'am writing an homepage using javascript, an express server and angular.
Currently I have following routing:
function config($routeProvider) {
$routeProvider
.when('/', {
templateUrl: '/login/login.view.html',
controller: 'loginCtrl',
controllerAs: 'vm'
})
.when('/home', {
templateUrl: '/home/home.view.html',
controller: 'homeCtrl',
controllerAs: 'vm'
})
.otherwise({redirectTo: '/'});
}
Instead of the redirection in .otherwise to login page I would like that the user gets an page like:
Not found
The requested URL <requestedURL> was not found on this server.
How can I get the requested url in the controller of redirected page?
Or what is the common way to implement this?
Kind regards,
Wolfgang

Angular routeprovider with same controller instance

I have an angular application where I use the routeprovider which points to different templates. A list template and a map template. These templates have controllers associated to them.
The problem is when i change the route, then the current controller instance is destroyed, and a new controller instance for the current template is re-initated. This is a problem because the map template initiates an openlayers map which is quite browser heavy.
Routeprovider:
app.config(['$routeProvider', function ($routeProvider) {
$routeProvider.
when('/list', {
reloadOnSearch: false,
templateUrl: '/listTpl.html'
}).
when('/map/', {
reloadOnSearch: false,
templateUrl: '/mapTpl.html'
})
.otherwise({
redirectTo: '/list'
});
});
}]);
MapTpl.html
script type="text/ng-template" id="/mapTpl.html">
<div ng-controller="mapController" class="map">
html stuff
</div>
So are there any way to persist these controllers, so the routeprovider just switches between those instances?
Thank you!

Angular UI Router controllers instantiated multiple times - Direct route

I have a parent / child route set up, and everything works great when I change the state in code using state.go(). The problem arises when I try to go directly to the child route using only a URL. When I do this, the controllers get initialized multiple times.
Here is my app.js
$stateProvider
.state('home', {
url: "/",
templateUrl: "Views/home.html",
controller: 'HomeController',
controllerAs: 'vm'
})
.state('ticketsMaster', {
abstract: true,
templateUrl: "Views/tickets-master.html",
url: "^/performances?featureCode&theatreId",
controller: 'TicketsMasterController',
controllerAs: 'vm'
})
.state('ticketsMaster.performances', {
url: "^/performances?featureCode&theatreId",
templateUrl: "Views/performances.html",
controller: 'PerformancesController',
controllerAs: 'vm'
})
$locationProvider.html5Mode({
enabled: true,
requireBase: false
});
home.html is my master page where I have my ui-view
I also have another ui-view on my tickets-master.html where this loads my child views (performances).
When going directly to /performances?featureCode=1111&theatreId=1 it loads my TicketsMasterController, and Performances controller 2 or 3 times.
Any help would be appreciated.

I found the answer here:
https://github.com/angular-ui/ui-router/issues/372
add this line to app.config:
$locationProvider.html5Mode(true).hashPrefix('!')
and include this line in the head of index.html:
<base href="/">

AngularJS router doesn't actually route much

So I'm fresh into AngularJS, trying to build my first application. And I'm stuck at routing. The first line works, which is just to load a view when the site is entered, but the next one is just telling me "Object not found".
Now I'm a true noob. I'm just running this on a plain MAMP stack.
This is the code I've written in JS:
angular.module("Portfolio", ['ngRoute', 'ngProgress']);
angular.module("Portfolio").config(function($routeProvider, $locationProvider) {
$routeProvider.when('/', {
templateUrl: '/assets/pages/home.php',
controller: 'MainController'
}).when('/test', {
templateUrl: "assets/pages/test.php",
controller: 'MainController'
});
$locationProvider.html5Mode(true);
});
I'm certain that there's no mistake in HTML, since the rest of the code works just fine.
So what did I do wrong here? Thanks.

angular.module("Portfolio", ['ngRoute', 'ngProgress']);
angular.module("Portfolio").config(function($routeProvider, $locationProvider) {
$routeProvider.when('/', {
templateUrl: '/assets/pages/home.php',
controller: 'MainController'
}).when('/test', {
templateUrl: "/assets/pages/test.php",/* your previous template url is not correct.*/
controller: 'MainController'
});
$locationProvider.html5Mode(true);
});

insert / in this routing
templateUrl: "/assets/pages/test.php",

Need to pass $scope with variables to another page in angular?

I have this routes:
$routeProvider
.when('/', {
templateUrl: 'views/main.html',
controller: 'MainCtrl',
controllerAs: 'main'
})
.when('/next', {
templateUrl: 'views/next.html',
controller: 'MainCtrl',
controllerAs: 'main'
})
.otherwise({
redirectTo: '/'
});
When I'm in main page. I clicking to next button and see 'views/next.html'. But I'm not have my previously $scope. How I can get this scope?

New route renders new template and also bind new scope to template. So you can't really just use the same scope for both routes. However, there are at least two workarounds.
1). $rootScope. $rootScope is available in all views so you can store some data in it and be able to access it in any template.
2). Service. Use shared service in both controllers. This is probably optimal solution for most cases.