angular.module('Demo',['ui.router'])
.config(["$urlRouterProvider",function(){
$urlRouterProvider.deferIntercept(defer); // defer = true/false
}])
this.deferIntercept = function (defer) {
if (defer === undefined) defer = true;
interceptDeferred = defer; // 默认是true
};
angular.module('Demo',['ui.router'])
.config(["$urlRouterProvider",function(){
$urlRouterProvider.otherwise(rule); // rule = 重定向的url规则
}])
angular.module('Demo',['ui.router'])
.config(["$urlRouterProvider",function($urlRouterProvider){
$urlRouterProvider.rule(function ($injector, $location) {
var path = $location.path(),
normalized = path.toLowerCase();
if (path !== normalized) {
return normalized;
}
});
}])
angular.module('Demo', ['ui.router']);
.config(["$urlRouterProvider",function ($urlRouterProvider) {
$urlRouterProvider.when($state.url, function ($match, $stateParams) {
if ($state.$current.navigable !== state || !equalForKeys($match, $stateParams) {
$state.transitionTo(state, $match, false);
}
});
}]);
$bob = $urlRouter.href(new UrlMatcher("/about/:person"), {
person: "bob"
});
// $bob == "/about/bob";
sync();
$state.go('contact.detail');
$state.href("about.person", { person: "bob" })
<div ng-class="{highlighted:$state.includes('.item')}">Item</div>
$state.$current.name = 'contacts.details.item';
$state.includes("contacts"); // true
$state.includes("contacts.details"); // true
$state.includes("contacts.details.item"); // true
$state.includes("contacts.list"); // false
$state.includes("about"); // false
$state.$current.name = 'contacts.details.item.url';
$state.includes("*.details.*.*"); // true
$state.includes("*.details.**"); // true
$state.includes("**.item.**"); // true
$state.includes("*.details.item.url"); // true
$state.includes("*.details.*.url"); // true
$state.includes("*.details.*"); // false
$state.includes("item.**"); // false
<div ng-class="{highlighted: $state.is('.item')}">Item</div>
$state.$current.name = 'contacts.details.item';
$state.is('contact.details.item'); // true
$state.is(contactDetailItemStateObject); // true
$state.reload('contact.detail');
$state.transitionTo($state.current, $stateParams, {
reload: true, inherit: false, notify: true
});
$stateProvider.decorator('views', function (state, parent) {
var result = {},
views = parent(state);
angular.forEach(views, function (config, name) {
var autoName = (state.name + '.' + name).replace('.', '/');
config.templateUrl = config.templateUrl || '/partials/' + autoName + '.html';
result[name] = config;
});
return result;
});
$stateProvider.state('home', {
views: {
'contact.list': { controller: 'ListController' },
'contact.item': { controller: 'ItemController' }
}
});
$state.go('home');
<a ui-sref="app.index">首页</a>
<!-- 这里是正常的跳转 -->
<a ui-sref="app.index({id:yourId})">你的主页</a>
<!-- 这里是带参数对象的跳转,名称是id,值是yourId -->
<div ng-app="Demo" ng-controller="testCtrl as ctrl">
<ol>
<li><a ui-sref="app">app</a></li>
<li><a ui-sref="test">test</a></li>
</ol>
<div ui-view></div>
<script type="text/ng-template" id="'page1.html'">
this is page 1 for app.
</script>
<script type="text/ng-template" id="'page3.html'">
this is page 1 for test.
</script>
</div>
angular.module('Demo', ['ui.router'])
.config(["$stateProvider","$urlRouterProvider",routeConfig])
.controller("testCtrl", angular.noop)
function routeConfig($stateProvider,$urlRouterProvider){
$urlRouterProvider.otherwise("/app");
$stateProvider
.state("app",{
url:"/app",
templateUrl:"'page1.html'"
})
.state("test",{
url:"/test",
templateUrl:"'page3.html'"
})
}
<div ng-app="Demo" ng-controller="testCtrl as ctrl">
<ol>
<li><a ui-sref="app.page1">app</a></li>
<li><a ui-sref="test.page1({id:1})">test</a></li>
</ol>
<div ui-view></div>
<script type="text/ng-template" id="'layout.html'">
<div ui-view="nav@"></div>
<div ui-view></div>
</script>
<script type="text/ng-template" id="'nav1.html'">
<ol>
<li><a ui-sref="app.page1">app.page1</a></li>
<li><a ui-sref="app.page2">app.page2</a></li
</ol>
</script>
<script type="text/ng-template" id="'nav2.html'">
<ol>
<li><a ui-sref="test.page1({id:1})">test.page1</a></li>
<li><a ui-sref="test.page2">test.page2</a></li
</ol>
</script>
<script type="text/ng-template" id="'page1.html'">
this is page 1 for app.
</script>
<script type="text/ng-template" id="'page2.html'">
this is page 2 for app.
</script>
<script type="text/ng-template" id="'page3.html'">
this is page 1 for test.
</script>
<script type="text/ng-template" id="'page4.html'">
this is page 2 for test.
</script>
</div>
angular.module('Demo', ['ui.router'])
.config(["$stateProvider","$urlRouterProvider",routeConfig])
.controller("testCtrl", angular.noop)
function routeConfig($stateProvider,$urlRouterProvider){
$urlRouterProvider.otherwise("/app/page1");
$stateProvider
.state("app",{
url:"/app",
views:{
"":{
templateUrl:"'layout.html'"
},
"nav":{
templateUrl:"'nav1.html'"
}
}
})
.state("app.page1",{
url:"/page1",
templateUrl:"'page1.html'"
})
.state("app.page2",{
url:"/page2",
templateUrl:"'page2.html'"
})
.state("test",{
url:"/test",
views:{
"":{
templateUrl:"'layout.html'"
},
"nav":{
templateUrl:"'nav2.html'"
}
}
})
.state("test.page1",{
url:"/page1?:id",
templateUrl:"'page3.html'",
controller:["$stateParams",function($stateParams){
console.log($stateParams.id);// 1 这里实现传参
}],
params:{
id:null
}
})
.state("test.page2",{
url:"/page2",
templateUrl:"'page4.html'"
})
}
机械节能产品生产企业官网模板...
大气智能家居家具装修装饰类企业通用网站模板...
礼品公司网站模板
宽屏简约大气婚纱摄影影楼模板...
蓝白WAP手机综合医院类整站源码(独立后台)...苏ICP备2024110244号-2 苏公网安备32050702011978号 增值电信业务经营许可证编号:苏B2-20251499 | Copyright 2018 - 2025 源码网商城 (www.ymwmall.com) 版权所有