Skip to content

Commit 8336d1a

Browse files
hikalkanhikalkan
committed
Changed ngRoute to ui-router for angular template.
1 parent d26d196 commit 8336d1a

27 files changed

+6081
-142
lines changed

‎Templates/All-In-One-Template/MySpaProject/MySpaProject.WebSpaAngular/App/Main/app.js

Lines changed: 14 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,59 +1,32 @@
11
(function () {
22
'use strict';
33

4-
var localize = abp.localization.getSource('MySpaProject');
5-
64
var app = angular.module('app', [
75
'ngAnimate',
8-
'ngRoute',
96
'ngSanitize',
107

8+
'ui.router',
119
'ui.bootstrap',
1210
'ui.jq',
1311

1412
'abp'
1513
]);
1614

17-
app.constant('routes', [
18-
{
19-
url: '/', //default
20-
config: {
15+
app.config([
16+
'$stateProvider', '$urlRouterProvider',
17+
function($stateProvider, $urlRouterProvider) {
18+
$urlRouterProvider.otherwise('/');
19+
$stateProvider
20+
.state('home', {
21+
url: '/',
2122
templateUrl: '/App/Main/views/home/home.cshtml',
22-
menuText: localize('HomePage'),
23-
menuItem: 'HomePage'
24-
}
25-
},
26-
{
27-
url: '/about',
28-
config: {
23+
menu: 'Home' //Matches to name of 'Home' menu in MySpaProjectNavigationProvider
24+
})
25+
.state('about', {
26+
url: '/about',
2927
templateUrl: '/App/Main/views/about/about.cshtml',
30-
menuText: localize('About'),
31-
menuItem: 'About'
32-
}
33-
}
34-
]);
35-
36-
app.config([
37-
'$routeProvider', 'routes',
38-
function ($routeProvider, routes) {
39-
routes.forEach(function (route) {
40-
$routeProvider.when(route.url, route.config);
41-
});
42-
43-
$routeProvider.otherwise({
44-
redirectTo: '/'
45-
});
46-
}
47-
]);
48-
49-
app.run([
50-
'$rootScope',
51-
function ($rootScope) {
52-
$rootScope.$on('$routeChangeSuccess', function (event, next, current) {
53-
if (next && next.$$route) {
54-
$rootScope.activeMenu = next.$$route.menuItem; //Used in layout.cshtml to make selected menu 'active'.
55-
}
56-
});
28+
menu: 'About' //Matches to name of 'Home' menu in MySpaProjectNavigationProvider
29+
});
5730
}
5831
]);
5932
})();

‎Templates/All-In-One-Template/MySpaProject/MySpaProject.WebSpaAngular/App/Main/styles/main.css

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,12 @@ body {
33
padding-top: 80px;
44
}
55
/* Angular transition animations */
6+
.angular-animation-container {
7+
position: relative;
8+
}
69
.shuffle-animation.ng-enter,
710
.shuffle-animation.ng-leave {
8-
position: relative;
11+
position: absolute;
912
}
1013
.shuffle-animation.ng-enter {
1114
-moz-transition: ease-out all 0.3s 0.4s;

‎Templates/All-In-One-Template/MySpaProject/MySpaProject.WebSpaAngular/App/Main/styles/main.less

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,13 @@ body {
66

77
/* Angular transition animations */
88

9+
.angular-animation-container{
10+
position: relative;
11+
}
12+
913
.shuffle-animation.ng-enter,
1014
.shuffle-animation.ng-leave {
11-
position: relative;
15+
position: absolute;
1216
}
1317

1418
.shuffle-animation.ng-enter {

‎Templates/All-In-One-Template/MySpaProject/MySpaProject.WebSpaAngular/App/Main/styles/main.min.css

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎Templates/All-In-One-Template/MySpaProject/MySpaProject.WebSpaAngular/App/Main/views/about/about.cshtml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<div ng-controller="app.controllers.views.about">
1+
<div ng-controller="app.views.about as vm">
22
<h1><img src="~/App/Main/images/abp-logo.png" style="padding-right: 10px;" />@string.Format(L("AboutFormat"), "ASP.NET Boilerplate")</h1>
33
<p>@Html.Raw(L("About_AspNetBoilerplateDescription"))</p>
44
<p>@L("ForMoreInformation"): <a href="http://www.aspnetboilerplate.com"><strong>aspnetboilerplate.com</strong></a>.</p>

‎Templates/All-In-One-Template/MySpaProject/MySpaProject.WebSpaAngular/App/Main/views/about/about.js

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
1-
(function() {
2-
var app = angular.module('app');
3-
4-
var controllerId = 'app.controllers.views.about';
5-
app.controller(controllerId, [
6-
'$scope', function($scope) {
7-
//...
1+
(function () {
2+
var controllerId = 'app.views.about';
3+
angular.module('app').controller(controllerId, [
4+
'$scope', function ($scope) {
5+
var vm = this;
6+
//Aboue logic...
87
}
98
]);
109
})();

‎Templates/All-In-One-Template/MySpaProject/MySpaProject.WebSpaAngular/App/Main/views/home/home.cshtml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
<div ng-controller="app.controllers.views.home">
2-
<h1>@L("WellcomeMessage")!</h1>
1+
<div ng-controller="app.views.home as vm">
2+
<h1>@L("WellcomeMessage")</h1>
33
<p class="lead">@L("Home_ThisIsATemplate")</p>
44
<div class="row">
55
<div class="col-md-4">

‎Templates/All-In-One-Template/MySpaProject/MySpaProject.WebSpaAngular/App/Main/views/home/home.js

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
11
(function() {
2-
var app = angular.module('app');
3-
4-
var controllerId = 'app.controllers.views.home';
5-
app.controller(controllerId, [
2+
var controllerId = 'app.views.home';
3+
angular.module('app').controller(controllerId, [
64
'$scope', function($scope) {
7-
//...
5+
var vm = this;
6+
//Home logic...
87
}
98
]);
109
})();

‎Templates/All-In-One-Template/MySpaProject/MySpaProject.WebSpaAngular/App/Main/views/layout/header.cshtml

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation" ng-controller="app.views.layout.header as vm">
2+
<div class="container">
3+
<div class="navbar-header">
4+
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
5+
<span class="sr-only">Toggle navigation</span>
6+
<span class="icon-bar"></span>
7+
<span class="icon-bar"></span>
8+
<span class="icon-bar"></span>
9+
</button>
10+
<a class="navbar-brand" href="#/"><i class="fa fa-cubes"></i> MySpaProject</a>
11+
</div>
12+
<div class="collapse navbar-collapse">
13+
<ul class="nav navbar-nav">
14+
<li ng-repeat="menuItem in vm.menu.items" ng-class="{active: vm.currentMenuName == menuItem.name}">
15+
<a ng-href="{{menuItem.url}}"><i class="{{menuItem.icon}}" ng-if="menuItem.icon"></i> {{menuItem.displayName}}</a>
16+
</li>
17+
</ul>
18+
<ul class="nav navbar-nav navbar-right">
19+
<li class="dropdown">
20+
<a href="" data-toggle="dropdown"><i ng-class="vm.currentLanguage.icon"></i> <span>{{vm.currentLanguage.displayName}}</span> <b class="caret"></b></a>
21+
<ul class="dropdown-menu">
22+
<li ng-repeat="language in vm.languages" ng-hide="vm.currentLanguage == language.name"><a href="/AbpLocalization/ChangeCulture?cultureName={{language.name}}"><i ng-class="language.icon"></i> {{language.displayName}}</a></li>
23+
</ul>
24+
</li>
25+
</ul>
26+
</div>
27+
</div>
28+
</div>

‎Templates/All-In-One-Template/MySpaProject/MySpaProject.WebSpaAngular/App/Main/views/layout/header.js

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
(function () {
2+
3+
var controllerId = 'app.views.layout.header';
4+
angular.module('app').controller(controllerId, [
5+
'$rootScope', '$state', function ($rootScope, $state) {
6+
var vm = this;
7+
8+
vm.languages = abp.localization.languages;
9+
vm.currentLanguage = abp.localization.currentLanguage;
10+
11+
vm.menu = abp.nav.menus.MainMenu;
12+
vm.currentMenuName = $state.current.menu;
13+
14+
$rootScope.$on('$stateChangeSuccess', function (event, toState, toParams, fromState, fromParams) {
15+
vm.currentMenuName = toState.menu;
16+
});
17+
}
18+
]);
19+
})();

0 commit comments

Comments
 (0)