Change how the ui-view directive handles page transitions

Question

Edit: DON'T DO IT. This is a waste of time, if you do not want to spend hours debugging, it turns out that it is much more complicated than I thought. At the moment, the solution to this is:

• Move resource loading from transformers and to the controller.
• Delete all incoming animations processed by ui-router.
• Add your own animated init and introduce the classes into the main area using an ng class.
• Use $scope.$emitfrom specialized controllers to inform the main controller when the material has finished loading.

In short, if you need it (I saw several questions in the tray about problems with ui-router), do not use resolvers or ng-animate to animate the input. You also cannot do this in event $stateChangeStartand outgoing animations, as this interferes with how ui-router works.

Below is my initial question.

---

I have a specific use case when I need page transitions and are allowed in a certain order, they currently occur as follows:

resolve > animate out > animate in

I like it more:

animate out > resolve > animate in

I decided to check the source code of ui-router and find out why it behaves the way it is. Fortunately, this is a very simple mod. In the ui-view directive, we have this code.

scope.$on('$stateChangeSuccess', function() {
    updateView(false); // cleanupLastView(); is at the end of this function
});
scope.$on('$viewContentLoading', function() {
    updateView(false); // cleanupLastView(); is at the end of this function
});

I need to update it to:

scope.$on('$stateChangeStart', function() {
    cleanupLastView();
});
scope.$on('$stateChangeSuccess', function() {
    updateView(false); // remove cleanupLastView();
});
scope.$on('$viewContentLoading', function() {
    updateView(false); // remove cleanupLastView();
});

, . "-" ui-router ui-view , ?

Answer 1

, , . - .

, ui-view BOTH , () rich97-view. , ui-view. , , , .