Ui-router have the powerful ability to define abstract states, or states that can ' t is navigated to, but is useful for def Ining a set of states with shared properties.
Angular.module ("auth", []) . config (function ($stateProvider) { $stateProvider . State (' in ', { '/in ', ' }" . State (' up ', { '/up ', ' a free account. }) ;
For example, the sign in page a sign up page share the same content. Those content can written into the abstract UI router.
Angular.module ("Auth", []). config (function($stateProvider) {$stateProvider. State (' Sign ', {abstract:true, URL:'/sign ', Template:' <a ui-sref= '. ' >sign in</a> ' + ' <a ui-sref= '. Up ' >sign up!</a> ' + ' <ui-view/> ', Controller:function($scope, Authservice) {$scope. SignIn=function() {authservice.signin (); }}, resolve: {}, data: {}, OnEnter:function() {}, OnExit:function() {}}). State (' Sign.in ', {URL:'/in ', Template:' }). State (' Sign.up ', {URL:'/up ', Template:' }) });
[AngularJS] ui-router:abstract states