I have a problem with my $urlRouterProvider.otherwise();
When emulated on android, the app launches on the artists state and not the welcome.
I don't see where the problem might come from.
app.config(['$stateProvider', '$urlRouterProvider', '$ionicConfigProvider', '$sceDelegateProvider', function($stateProvider, $urlRouterProvider, $ionicConfigProvider, $sceDelegateProvider){
$stateProvider.state('welcome', {
url: '/welcome',
templateUrl: 'templates/welcome.html',
controller: 'WelcomeCtrl'
})
.state('user',{
url:'/user',
templateUrl: 'templates/user.html',
controller: 'UserCtrl'
})
.state('settings',{
url:'/settings',
templateUrl: 'templates/settings.html'
// controller: 'SettingsCtrl'
})
.state('artists',{
url:'/artists',
templateUrl: 'templates/artists.html',
controller: 'ArtistsCtrl'
})
.state('artist',{
url:'/artists/:artistId',
templateUrl: 'templates/artist.html',
controller: 'ArtistCtrl'
})
.state('search',{
url:'/search',
templateUrl: 'templates/search.html',
controller: 'SearchCtrl'
});
$urlRouterProvider.otherwise('/welcome');
}]);
thanks for any help !
try using
$stateProvider
.state("welcome", { url : '/welcome'})
Related
I have web application where I need to load a template with different parameters like.
.when('/form/:ProjectID/:FormID', {
templateUrl: 'partials/Form.ashx?fid=' + FormID,
controller: 'FormController'
})
I am not able to get the above code working. Can someone tell me how I can fix this issue? I am new to AngularJS and not an expert.
This is the full code.
var app = angular.module('MyApp', ['ui.grid', 'ngSanitize', 'angularTrix', 'ui.codemirror', 'ngRoute']);
app.config(function ($routeProvider) {
$routeProvider
.when('/home', {
templateUrl: 'partials/Home.ashx',
controller: 'HomeController'
})
.when('/project/:ProjectID', {
templateUrl: 'partials/Projects.ashx',
controller: 'ProjectController'
})
.when('/form/:ProjectID/:FormID', {
templateUrl: 'partials/Form.ashx?fid=1',
controller: 'FormController'
})
.otherwise({ redirectTo: '/home' });
});
We can use $stateParams and templateProvider to load dynamic templateurl
.state('general', {
url: '/{type}',
//templateUrl: 'pages/home.html',
templateProvider: ['$stateParams', '$templateRequest',
function($stateParams, $templateRequest)
{
var tplName = "pages/" + $stateParams.type + ".html";
return $templateRequest(tplName);
}
],
// general controller instead of home
//controller: 'homeController',
controller: 'generalController',
controllerAs: 'ctrl'
I have an ng-click on a button to open a modal. When I try to open it, the design open a modal but with the page where I open it. Why is it possible?
$scope.EditPlayer = function (gid) {
var modalIstance = $uibModal.open({
templateUrl: "/Modal/modalUser.html",
controller: 'UserEditController'
});
}
I think that my routing create some problem...
.config(function ($routeProvider, $locationProvider) {
$routeProvider
.when('/', { controller: 'MainController', templateUrl: 'Views/home.html' })
.when('/index', { controller: 'MainController', templateUrl: 'Views/home.html' })
.when('/index.html', { controller: 'MainController', templateUrl: 'Views/home.html' })
.when('/userlist', { controller: 'UserListController', templateUrl: 'Views/userlist.html' })
.when('/useradd', { controller: 'UserAddController', templateUrl: 'Views/useradd.html' })
$locationProvider.html5Mode(true);
})
Anyone can help me? Thanks
Hi below is my code for urlRouterProvider otherwise.
.config(function config($urlRouterProvider, $stateProvider) {
$urlRouterProvider.otherwise('/invalid');
$stateProvider.state('view', {
url: '/view?{businessId:^[0-9]{1,20}$}',
templateUrl: 'view/view.tpl.html',
controller: 'ViewCtrl',
controllerAs: 'vm'
})
.state('otherwise', {
url: '/invalid',
templateUrl: 'view/view.error.tpl.html'
});
})
This is what i am expecting:
1. if i go to view?businessId=12345 it should load the page without any issues
2. if i go to view?businessId=abcd it should re-direct it to the view.error.tpl.html
But instead, it does nothing if i enter the invalid url.
I reffered to this post for help but none of the options really work Otherwise on StateProvider
you can try this, without using the otherwise function:
$stateProvider.state('view', {
url: '/view?{businessId:^[0-9]{1,20}$}',
templateUrl: 'view/view.tpl.html',
controller: 'ViewCtrl',
controllerAs: 'vm'
})
.state('otherwise', {
url: '*path',
templateUrl: 'view/view.error.tpl.html'
});
Try this
.config(function ($urlRouterProvider, $stateProvider) {
$stateProvider.state('view', {
url: '/view?{businessId:^[0-9]{1,20}$}',
templateUrl: 'view/view.tpl.html',
controller: 'ViewCtrl',
controllerAs: 'vm'
})
.state('otherwise', {
url: '*path',
templateUrl: 'view/view.error.tpl.html'
});
})
var mysite = angular.module('myApp', ['ui.router','ui.bootstrap']);
mysite.config(function($stateProvider, $urlRouterProvider, $locationProvider ) {
$urlRouterProvider.otherwise('/portfolio');
$stateProvider
// HOME STATES AND NESTED VIEWS ========================================
.state('portfolio', {
url: '/portfolio',
templateUrl: 'portfolio/portfolio.html',
controller: 'MainController'
})
.state('about', {
url: '/about',
templateUrl: 'about/about.html',
controller: 'MainController'
})
.state('contact', {
url: '/contact',
templateUrl: 'contact/contact.html',
controller: 'MainController'
})
});
I am getting Unknown provider: $locationProvider from ui.router.router error while running the page .
Please help if i am missing something in the code .
use
mysite.config(function($stateProvider, $urlRouterProvider)
instead of
mysite.config(function($stateProvider, $urlRouterProvider, $locationProvider )
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'
});
}]);