i find the solution AngularJS and UI-Router: 'Error: transition superseded' during angularjs unit tests but this not work for me.
AngularJs version v1.6.1
Ui-routing Version v0.3.2
I solved it.
In my project, root state is login state if login is successful then it goes to admin.dashboard state, where admin state was an abstract state.
I used$state.transitionTo method instead of $state.go when transitioning to the admin.dashboard state.
I've also added on app.config section.
$qProvider.errorOnUnhandledRejections(false);
Related
I'm currently exploring an upgrade path for a pretty large AngularJS 1.6 app to Angular 6. I have my app bootstrapping as a hybrid app, and I've begun converting individual modules and components. I need to be able to do the migration in chunks, though. It would be nice if I could migrate a module at a time, but I'm running into some issues, to that end.
I have a NavBar directive which resides in my core AngularJS module. That component is being downgraded with downgradeComponent and registered on the AngularJS core module. The landing AngularJS module has a dependency on the core module so that it can use the NavBar. This works fine, because the LandingComponent has also been converted to Angular6 and is being downgraded and registered on the landing AngularJS module.
There is a problem with using the NavBar component inside of any other AngularJS component, though. I have a third AngularJS module called workflows with a ViewWorkflows component that has a NavBar inside its template. When I navigate to that component, I get the following error:
angular.js:14791 Error: No component factory found for NavBarDirective. Did you add it to #NgModule.entryComponents?
I can fix this by converting and then downgrading ViewWorkflows, but since NavBar is being registered as a downgraded AngularJS component, shouldn't any AngularJS module that declares a dependency on the core module have access to it?
Code (Not runnable)
Edit: I've updated the gist to be a little more simple. The landing module is Angular, with an Angular component, <landing> that is downgraded to run on the AngularJS landing module and has a <t-nav-bar> inside it. It has a dependency on the core module which provides the downgraded <t-nav-bar> directive. The <test> component is an AngularJS component registered on the AngularJS landing module that cannot use the <t-nav-bar>. Without even bringing the workflows module into the situation, it doesn't work. What am I doing wrong?
I have managed to sort this out. I was trying to declare the NavBar as an Angular #Directive. It actually needs to be a #Component. After making that switch, it works exactly as expected.
I spun up this repo to test with, and discovered the issue there. It's a new Angular 6 app that I "downgraded" for experimenting.
In bower the angular-component-router package is only at 0.2.1. Is that the right router for angular 1.5.5? Seems weird that the documentation would point to this for Angular 1 if it's not RTM yet.
Thanks in advance.
The current implementation of component router for Angular 1 is depreciated. They are considering to backport Angular 2 component router.
https://docs.angularjs.org/guide/component-router
Deprecation Notice: In an effort to keep synchronized with router
changes in Angular 2, this implementation of the Component Router
(ngComponentRouter module) has been deprecated and will not receive
further updates. We are investigating backporting the Angular 2 Router
to Angular 1, but alternatively, use the ngRoute module or community
developed projects (e.g. ui-router).
I'm using Angular 1.2.18, ng-animate 1.2.18 and ui-router 0.2.10 (but I've tried with latest build from git repo). When I enable animations and define my transition css, it all seems to work fine, if state change is triggered by clicking link with href / ui-sref. But when I use $state.go('mystate'), it does change the state properly as always, but the transition is not playing at all.
All those libs even compatible with each other?
The app I'm writing is using the resolve property in the main UI router state.
It tries to resolve to a list of things, using a factory that uses $http.
So I was trying to implement error handling, I changed my server to return a 404 status, and added thus lines:
$rootScope.$on('$stateChangeError', function(event) {
$state.go('404');
});
as Nate Abele explained here: Angular UI router handling 404s
Now the app do try to change the state to my 404 state, but a very strange loop occurred. The app keep trying to resolve the failed factory from the resolve property.
Haven't figured up why until now.
Any suggestions ? Thanks.
I am trying to test the default redirect for my angularjs application based on angular ui router, No matter what I did, the otherwise config was ignored, I tried to forcefully call the update method of urlRouter, To achieve this I injected $urlRouter in my test. voila original code started working.
https://gist.github.com/himangshuj/8142045
This is the gist of my change. Revision 4 is the thing that worked.
If you're using $urlRouterProvider without $stateProvider, you have to inject $urlRouter in order for it to be initialized and properly hook into $location..
answered on github, it seems this is expected behavior
https://github.com/angular-ui/ui-router/issues/718#issuecomment-31246720