首页 > 代码库 > [AngularJS] ui-router: Abstract States
[AngularJS] ui-router: Abstract States
ui-router has the powerful ability to define abstract states, or states that can‘t be navigated to, but are useful for defining a set of states with shared properties.
angular.module("auth", []) .config(function ($stateProvider) { $stateProvider .state(‘in‘, { url: ‘/in‘, template: ‘<h1>Sign In</h1>‘ + ‘<button class="btn btn-primary" ng-click="signIn()">Sign In Now</button>‘ }) .state(‘up‘, { url: ‘/up‘, template: ‘<h1>Sign Up for a Free Account.</h1>‘ }) });
For example, the sign in page an sign up page share the same content. Those content can be written into the abstract ui router.
angular.module("auth", []) .config(function ($stateProvider) { $stateProvider .state(‘sign‘, { abstract: true, url: ‘/sign‘, template: ‘<a ui-sref=".in">Sign In</a>‘ + ‘<a ui-sref=".up">Sign Up!</a>‘ + ‘<ui-view/>‘, controller: function($scope, authService){ $scope.signIn = function(){ authService.signIn(); } }, resolve: {}, data: {}, onEnter: function(){}, onExit: function(){} }) .state(‘sign.in‘, { url: ‘/in‘, template: ‘<h1>Sign In</h1>‘ + ‘<button class="btn btn-primary" ng-click="signIn()">Sign In Now</button>‘ }) .state(‘sign.up‘, { url: ‘/up‘, template: ‘<h1>Sign Up for a Free Account.</h1>‘ }) });
[AngularJS] ui-router: Abstract States
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。