Bolboa Bolboa - 2 months ago 15
AngularJS Question

angular $stateprovider not working as expected

I'm using angular

$stateProvider
to allow routes throughout my app. I have an
index.html
and I am changing the html content inside using the following...

app.config(function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/app');
$stateProvider

.state('app', {
url: '/app',
templateUrl: 'templates/menu.html',
controller: 'AppCtrl'
})
.state('app.accounts', {
url: '/accounts',
templateUrl: 'templates/accounts.html'
})
});


The first route works, when you open the app
template/menu.html
is put inside
index.html
. The problem occur when I try to change the state.

At the moment, I am implementing an API in my app, what the API does is irrelevant, but on success I want the API to change the state to
app.accounts
, see below...

app.controller('AppCtrl', function($scope, $ionicModal, $timeout) {
$scope.create = function() {
var linkHandler = Plaid.create({
env: 'tartan',
clientName: 'Example Project',
key: 'test_key',
product: 'connect',
//On success I want to change the state
onSuccess: function(token) {
window.location = '/app/accounts';

},
});
linkHandler.open();
}

});


Above, on success, I attempt changing the state, but when
window.location
is called, I get the error...

net::ERR_FILE_NOT_FOUND (file:///app/accounts)


I am not sure why I get this error because the first route works fine. Any idea how I can fix this?

Answer

Your path is wrong. That's what the error is saying. It can't find that route.

Try $window.location.href = "/#/app/accounts";

Remember to inject $window in the controller.

However a better way would be to inject the $state service and use it to navigate:

$state.go('app.accounts')