Whenever I attempt to go to profile state I'm thrown back to the home state (no errors in console).
Here's my setup:
app.js
angular.module('app',[
'oclazyLoad'
'app.components'
])
.config(['$stateProvider', '$urlRouterProvider', '$locationProvider', '$httpProvider',
function ($stateProvider, $urlRouterProvider, $locationProvider, $httpProvider) {
$urlRouterProvider.otherwise('/');
//$locationProvider.html5Mode(true);
$httpProvider.interceptors.push('jwtInterceptor');
function lazyLoad(pathjs) {
return ['$ocLazyLoad', function ($ocLazyLoad) {
return $ocLazyLoad.load(pathjs);
}];
}
$stateProvider
.state('home', {
url: '/',
template: 'asd'
})
.state('profile', {
url: '/profile',
templateUrl: 'components/profile/profile.html',
controller: 'profileCtrl',
controllerAs: 'vm',
resolve: {
module: lazyLoad('components/profile/profile.js'),
user: ['SessionService', function (SessionService) {
return {fake: 'user'};//SessionService.currentUser(true);
}]
}
})
}]);
angualar.module('app.components',[]);
profile.js
angular.module('app.components')
.controller('profileCtrl', ['user', function(user){
var vm = this;
vm.test = 123;
}]);
profile.html
<div>{{vm.test || 1}}</div>
This was an embarrasing problem but I forgot to return the response in my $http interceptor jwtInterceptor.
Related
I have a angular application in wamp in a subfolder.
When i go to http://myapp.dev/angular/myapp i'm getting the 404 view instead of the home view.
What did i miss here?
thanks,
runConfig.$inject = ['$stateProvider', '$urlRouterProvider', '$locationProvider', '$provide'];
function runConfig($stateProvider, $urlRouterProvider, $locationProvider, $provide) {
$stateProvider
.state('home', {
url: '/',
controller: 'HomeController',
controllerAs: 'vm',
templateUrl: 'components/home/homeView.html'
})
.state('404', {
templateUrl: 'tpl/404.html'
});
$urlRouterProvider.otherwise(function ($injector, $location) {
var $state = $injector.get('$state');
$state.go('404');
return $location.path();
});
$locationProvider.html5Mode(true);
I have the following routing configuration:
$locationProvider.html5Mode().enabled = true;
config file:
define(function (require) {
"use strict";
return ['$stateProvider', '$urlRouterProvider', function ( $stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/error/404');
require('filePath')($stateProvider);
}];
});
routing file:
define( function () {
return function ( $stateProvider ) {
return $stateProvider.state('hi', {
url: '/',
templateUrl: 'common/hi.html',
controller: 'HiController'
})
.state('404', {
url: '/error/404',
templateUrl: '404.html',
})
.state('somePage', {
url: '/some/page',
templateUrl: 'page.html',
controller: 'HiController'
});
};
});
and now, when I try to open e.g. site.com/some/page I'm being redirected to site.com/error/404. Why ?
Take the following code. I have a cookie that is created once a user successfully logs in. My API is also already authenticated. What I am looking to do is do a simple check of the cookie before serving up a route, with the only exception of the login route.
angular
.module('pizzaGiants.routes', ['ui.router'])
.config(['$stateProvider', '$locationProvider', '$urlRouterProvider',
function ($stateProvider, $locationProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/login');
// Application Routes
// -----------------------------------
// add check if cookie exists else redirect to login
$stateProvider
.state('login', {
url: '/login',
templateUrl: 'features/login/login.html',
controller: 'loginCtrl'
})
.state('attributes', {
url: '/attributes',
templateUrl: 'features/attributes/attributes.html',
controller: 'attributesCtrl'
})
.state('users', {
url: '/users',
templateUrl: 'features/users/users.html',
controller: 'usersCtrl'
})
.state('signup', {
url: '/signup',
templateUrl: 'features/signup/signup.html',
controller: 'signupCtrl'
})
.state('roles', {
url: '/roles',
templateUrl: 'features/roles/roles.html',
controller: 'rolesCtrl'
})
.state("fruits", {url: "/fruits",templateUrl: "features/fruits/fruit.html",controller: "fruitCtrl"}).state("colors", {url: "/colors",templateUrl: "features/colors/color.html",controller: "colorCtrl"}).state("contacts", {url: "/contacts",templateUrl: "features/contacts/contact.html",controller: "contactCtrl"})
}]);
Could be like following
app.run([
'$rootScope','$location', '$timeout',
function ($rootScope, $location, $timeout) {
$rootScope.$on('$stateChangeStart', function () {
if (// your condition logic) {
$timeout(function () {
$location.path("/login");
}, 1);
}
});
}
]);
I am unable to change my Url using $state.go but i am getting that page for which i have requested in $state.go , I have also used route.js
angular.module("myApp")
.controller('myController', ['$scope','$state', function ($scope, $state) {
$scope.showDetails = function(data){
if(some true condition){
$state.go("create.preemp");
}
else if(some true condition){
$state.go("create.prepolicy");
}
}
}])
angular.module("myApp")
.config(function ($stateProvider, $routeProvider, $urlRouterProvider) {
$stateProvider
.state('signin', {
url: '/',
templateUrl: 'signin/signin.html',
controller: 'signinController'
})
.state('create.preemp', {
url: '/create.preemp',
templateUrl: 'preemp.html',
controller: 'preempController'
})
.state('create.prepolicy', {
url: '/create.prepolicy',
templateUrl: 'prepolicy.html',
controller: 'prepolicyController'
})
$urlRouterProvider.otherwise('/');
})
??
Playing around with angular stateProvider, this is my route:
app.config(['$stateProvider', function ($stateProvider) {
$stateProvider
.state("start", {
url: "/",
templateUrl: 'start.html',
controller: 'StartCtrl'
})
.state("test", {
url: "/",
templateUrl: 'test.html',
controller: 'TestCtrl'
});
}]);
On bootstrapping I would like to go to state 'test':
app.run(['$rootScope', '$state', '$stateParams', function ($rootScope, $state, $stateParams) {
$state.go('test');
console.log('app.run');
}]);
These are the controllers:
app.controller('StartCtrl', function($scope) {
console.log('start');
});
app.controller('TestCtrl', function($scope) {
console.log('test');
});
Why is the application routing to the 'start' state ? I would like to go to the 'test' state?
Code reference:http://plnkr.co/edit/FCcL4M?p=preview
You need to change the url for either the test or the start "state", right now they are both the same. I changed the test state url to "/test" and it loaded correctly.
http://plnkr.co/edit/2esV4dbd4ptNSEmwD3g4?p=preview
app.config(['$stateProvider',
function($stateProvider) {
$stateProvider
.state("start", {
url: "/",
templateUrl: 'start.html',
controller: 'StartCtrl'
})
.state("test", {
url: "/test",
templateUrl: 'test.html',
controller: 'TestCtrl'
});
}
]);
Just need to add to previous answer : both start and test need to be corrected
to follow standards.
http://plnkr.co/edit/TjDzyL?p=preview
pp.config(['$stateProvider', function ($stateProvider) {
$stateProvider
.state("start", {
url: "/start",
templateUrl: 'start.html',
controller: 'StartCtrl'
})
.state("test", {
url: "/test",
templateUrl: 'test.html',
controller: 'TestCtrl'
});
}]);