FazBrowse GitHub Viewer
|
Trending
|
URL:
|
Home
Tools:
[Download Repo ZIP]
[View Raw Code]
[Original HTTPS Page]
angular2-webpack-starter/src/app/app.ts at master · i4ba1/angular2-webpack-starter · GitHub
i4ba1
/
angular2-webpack-starter
Public
forked from
PatrickJS/angular-webpack-starter
Notifications
You must be signed in to change notification settings
Fork
0
Star
0
Code
Pull requests
0
Actions
Projects
Wiki
Security and quality
0
Insights
Additional navigation options
Code
Pull requests
Actions
Projects
Wiki
Security and quality
Insights
Expand file tree
Breadcrumbs
angular2-webpack-starter
/
src
/
app
/
app.ts
Copy path
More file actions
More file actions
Latest commit
History
History
History
87 lines (81 loc) · 2.25 KB
Breadcrumbs
angular2-webpack-starter
/
src
/
app
/
app.ts
Copy path
File metadata and controls
87 lines (81 loc) · 2.25 KB
Raw
Copy raw file
Download raw file
Open symbols panel
Edit and raw actions
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
/*
* Angular 2 decorators and services
*/
import
{
Component
}
from
'angular2/core'
;
import
{
RouteConfig
,
Router
,
ROUTER_DIRECTIVES
}
from
'angular2/router'
;
import
{
FORM_PROVIDERS
}
from
'angular2/common'
;
import
{
RouterActive
}
from
'./directives/router-active'
;
import
{
Home
}
from
'./home/home'
;
/*
* App Component
* Top Level Component
*/
@
Component
(
{
selector
:
'app'
,
providers
:
[
...
FORM_PROVIDERS
]
,
directives
:
[
...
ROUTER_DIRECTIVES
,
RouterActive
]
,
pipes
:
[
]
,
styles
:
[
`
nav ul {
display: inline;
list-style-type: none;
margin: 0;
padding: 0;
width: 60px;
}
nav li {
display: inline;
}
nav li.active {
background-color: lightgray;
}
`
]
,
template
:
`
<header>
<nav>
<h1>Hello {{ name }}</h1>
<ul>
<li router-active>
<a [routerLink]=" ['Index'] ">Index</a>
</li>
<li router-active>
<a [routerLink]=" ['Home'] ">Home</a>
</li>
<li router-active>
<a [routerLink]=" ['About'] ">About</a>
</li>
</ul>
</nav>
</header>
<main>
<router-outlet></router-outlet>
</main>
<footer>
WebPack Angular 2 Starter by <a [href]="url">@AngularClass</a>
<div>
<img [src]="angularclassLogo" width="10%">
</div>
</footer>
`
}
)
@
RouteConfig
(
[
{
path
:
'/'
,
component
:
Home
,
name
:
'Index'
}
,
{
path
:
'/home'
,
component
:
Home
,
name
:
'Home'
}
,
// Async load a component using Webpack's require with es6-promise-loader and webpack `require`
{
path
:
'/about'
,
loader
:
(
)
=>
require
(
'es6-promise!./about/about'
)
(
'About'
)
,
name
:
'About'
}
,
{
path
:
'/**'
,
redirectTo
:
[
'Index'
]
}
]
)
export
class
App
{
angularclassLogo
=
'assets/img/angularclass-avatar.png'
;
name
=
'Angular 2 Webpack Starter'
;
url
=
'https://twitter.com/AngularClass'
;
constructor
(
)
{
}
}
/*
* Please review the https://github.com/AngularClass/angular2-examples/ repo for
* more angular app examples that you may copy/paste
* (The examples may not be updated as quickly. Please open an issue on github for us to update it)
* For help or questions please contact us at @AngularClass on twitter
* or our chat on Slack at https://AngularClass.com/slack-join
*/
Back
|
FazBrowse Home
|
New Git URL