Let's say we want a parent state which is a abstract state. Two children states, one is for sinlge account view and another is for multi-accounts view.

By default, we want to go single account view:

 .state('selfcare.my-services', {
url: 'my-services',
abstract: true,
resolve: {
authenticate: authenticate
}
})
.state('selfcare.my-services.single', {
url: '',
views: {
'main@': {
template: '<clm-my-services></clm-my-services>'
}
},
resolve: {
router: ($q, UserService) => {
let loginName = UserService.userProfileDataFromJWT.loginName;
return UserService.getServiceDetails(loginName)
.then((res) => {
if (_.size(res.billAccounts) > 1) {
return $q.reject('TO_MULTI_SERVICES');
} else {
return $q.when();
}
});
}
}
})

The idea is:

  • Keep the default child state's url empty, so it knows this child state is default one, it will have the same url as parent.
  • Make parent state as abstract state.
  • authenticate is only need for parent, because it always goes from parent to children, so if parent is authenticated then it means child state is also authenticated.

Then in the code we have:router resolve block, you can name it anything you want:

router: ($q, UserService) => {
let loginName = UserService.userProfileDataFromJWT.loginName;
return UserService.getServiceDetails(loginName)
.then((res) => {
if (_.size(res.billAccounts) > 1) {
return $q.reject('TO_MULTI_SERVICES');
} else {
return $q.when();
}
});

It says that if there is multi service accounts then go multi-service account. So reject the promise, it will be handled by $stateChangeError.

$stateChangeError:

$rootScope.$on('$stateChangeError', function (event, toState, toParams, fromState, fromParams, error) {
switch (error) {case 'TO_SINGLE_SERVICE':
return $state.go('selfcare.my-services.single');
case 'TO_MULTI_SERVICES':
return $state.go('selfcare.my-services.compsite');
default:
$state.go('login.main');
} $('.progress-bar')
.hide();
});

The same as to handle multi-account view. And because you cannot access abstract directly by url, so to access the account, you need to do:

ui-sref="selfcare.my-services.single"

[AngularJS] Default Child state and nav between child state More articles about

  1. Unable to make the session state request to the session state server Handle

    Server Error in '/' Application. Unable to make the session state request to the session state serve ...

  2. stay IIS It's wrong to browse the times after publishing the project :Unable to make the session state request to the session state server

    Error description : Unable to make the session state request to the session state server. Please ensure that the A ...

  3. Unable to make the session state request to the session state server processing method

    Server Error in '/' Application. Unable to make the session state request to the session state serve ...

  4. About props and state as well as redux Medium state

    React The data model is divided into common data and private data , Shared data can be passed between components , Private data is private for the current component . There's data in React Use in props Object to call , It contains all the attribute names and values of the tag ,props There are three objects ...

  5. Ext.state.Manager.setProvider(new Ext.state.CookieProvider())

    Ext.state.Manager.setProvider(new Ext.state.CookieProvider()) initialization Ext State Manager , stay Cookie Record the user's operation status in , If not enabled , Elephant brush ...

  6. turn : solve 【Unable to make the session state request to the session state server】

    Error description : Unable to make the session state request to the session state server. Please ensure that the A ...

  7. File(File f, String child) File(String parent, String child)

    ( Reprint )File(File f, String child) according to f Abstract pathnames and child Pathname string to create a new File example . f Abstract pathnames are used to represent directories ,child The pathname string is used to represent the directory ...

  8. [Functional Programming + React] Provide a reasonable default value for mapStateToProps in case initial state is undefined

    For example we have a component, it needs to call 'react-redux' connect function. import { compose, ...

  9. [Functional Programming Monad] Substitute State Using Functions With A State Monad (get, evalWith)

    We take a closer look at the get construction helper and see how we can use it to lift a function th ...

Random recommendation

  1. dbcp Data source configuration

    <!-- data source 1 --> # Driver information (driver, url, username, password)driverClassName=net.sourceforge.jtds.jdbc. ...

  2. hadoop Use of

    Premise Environmental Science ubuntu install hadoop It's been a while 1. Prompt at startup Connection reset by peer Look at the log , It says ssh The permission of a file in it is too large This ssh Internal modification ...

  3. Unity To realize List Type customization GUI(ReorderableList)

    Thank you for your resources Unity It provides float,int,vector3.. And so on gui Interface , For collection types, you should write them yourself . Officials provided one List The custom of GUI, But it's very complicated to use Uni ...

  4. Date tool class - DateUtil.java

    Date tool class , Provides methods for formatting and converting dates . Get interval date . Specify Date . On the last day of the month . Source code is as follows :( Click to download -DateUtil.java.commons-lang-2.6.jar ) import ja ...

  5. leetcode:Odd Even Linked List

    Given a singly linked list, group all odd nodes together followed by the even nodes. Please note her ...

  6. iOS Serialization and deserialization

    1 What's the use of serialization ? An object-oriented program creates a complex object graph when it runs , It is often necessary to serialize the object graph in a binary way , This process is called Archiving. Binary streams can be written to files or over the network ( It comes from a teaching material ...

  7. Ajax Page Jump

    <script type="text/javascript" >    $(document).ready(function () {            $(&qu ...

  8. 【Python】 Three examples of how to write code

    This article includes the use of Python The Fibonacci sequence written by me , The three digit narcissus number and the basic code for a hundred dollars to buy a hundred chickens : ( One ) Fibonacci sequence : ''' def hanshu(n): n_1 = 1 n_2 = 1 m = n sumn ...

  9. Go First experience - Error and exception handling - recover and panic

    Look at the code first : Output : Built-in functions panic We can artificially create a runtime panic . however , This fatal error can be recovered . stay Go In language , Built-in functions recover That can be done . actually , Built-in functions panic and reco ...

  10. java and c++ Implementation of various basic data structures and algorithms

    https://github.com/phishman3579/java-algorithms-implementation https://github.com/xorz57/forest