View home.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//http://www.siraj360.com/ng2/ :: A single page application developed with Angular 2 (beta) and Bootstrap 4 (alpha). | |
<div class="row"> | |
<div class="jumbotron bg-inverse" style="background-color:#eb7d00"> | |
<div class="container"> | |
<h5><b><span class="label label-primary label-pill">Let's Do Something Awesome!</span></b></h5> | |
<h1 class="display-3">ng2 & BS4 in action!</h1> | |
<h4>A sample single page application developed with Angular 2 (beta) and Bootstrap 4 (alpha).</h4> | |
<h4> | |
Code snippets/files are at <a class="label label-danger" | |
href="https://gist.github.com/SirajGadhia" |
View rating.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//http://www.siraj360.com/ng2/ :: A single page application developed with Angular 2 (beta) and Bootstrap 4 (alpha). | |
import { Component, View, Input, Output, EventEmitter } from 'angular2/core'; | |
import { CORE_DIRECTIVES, NgClass } from 'angular2/common'; | |
@Component({ | |
selector: 'rating' | |
}) | |
@View({ |
View home.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//http://www.siraj360.com/ng2/ :: A single page application developed with Angular 2 (beta) and Bootstrap 4 (alpha). | |
import { Component } from 'angular2/core'; | |
import { RouterLink } from 'angular2/router'; | |
import { RatingComponent } from '../rating/rating.component'; | |
@Component({ | |
selector: 'home', | |
templateUrl: 'app/components/home/home.component.html', | |
directives: [RouterLink, RatingComponent] |
View data.service.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//http://www.siraj360.com/ng2/ :: A single page application developed with Angular 2 (beta) and Bootstrap 4 (alpha). | |
import { Injectable } from 'angular2/core'; | |
import {Employees} from '../data/data.employees'; | |
import {Courses} from '../data/data.courses'; | |
@Injectable() | |
export class DataService { | |
constructor() { } | |
View employeelist.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//http://www.siraj360.com/ng2/ :: A single page application developed with Angular 2 (beta) and Bootstrap 4 (alpha). | |
<div class="row p-a-1"> | |
<h4 class="text-primary">ETMS : Employee Training Managment System.</h4> | |
</div> | |
<div *ngFor="#employee of employees; #idx = index" > | |
<employee [employee] ="employee" [sr-no]="idx"></employee> | |
</div> |
View employeelist.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//http://www.siraj360.com/ng2/ :: A single page application developed with Angular 2 (beta) and Bootstrap 4 (alpha). | |
import { Component } from 'angular2/core'; | |
import { CORE_DIRECTIVES } from 'angular2/common'; | |
import { EmployeeComponent } from '../employee/employee.component'; | |
import { DataService } from '../../services/data.service'; | |
@Component({ | |
selector: 'employee-list', | |
directives: [CORE_DIRECTIVES, EmployeeComponent], | |
providers: [DataService], |
View employee.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//http://www.siraj360.com/ng2/ :: A single page application developed with Angular 2 (beta) and Bootstrap 4 (alpha). | |
<div class="card" > | |
<div class="card-header card-primary" [class.card-danger]="employee.isAllPending" | |
[class.card-success]="employee.isAllCompleted" | |
style="color:#ffffff !important;"> | |
<a *ngIf="!employee.isShowCourses" (click)="employee.isShowCourses = !employee.isShowCourses" | |
class="btn btn-sm btn-secondary"> | |
<i class="fa fa-chevron-up"></i> | |
</a> | |
<a *ngIf="employee.isShowCourses" (click)="employee.isShowCourses = !employee.isShowCourses" |
View employee.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//http://www.siraj360.com/ng2/ :: A single page application developed with Angular 2 (beta) and Bootstrap 4 (alpha). | |
import { Component, Input } from 'angular2/core'; | |
import { CORE_DIRECTIVES } from 'angular2/common'; | |
import { RouterLink } from 'angular2/router'; | |
@Component({ | |
selector: 'employee', | |
templateUrl: 'app/components/employee/employee.component.html', | |
directives: [CORE_DIRECTIVES, RouterLink] | |
}) |
View app.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//http://www.siraj360.com/ng2/ :: A single page application developed with Angular 2 (beta) and Bootstrap 4 (alpha). | |
<header></header> | |
<main class="container-fluid" > | |
<router-outlet></router-outlet> | |
</main> | |
<fotter></fotter> |
View app.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//http://www.siraj360.com/ng2/ :: A single page application developed with Angular 2 (beta) and Bootstrap 4 (alpha). | |
import { Component } from 'angular2/core'; | |
import { ROUTER_DIRECTIVES, RouteConfig } from 'angular2/router'; | |
import { HomeComponent } from '../home/home.component'; | |
import { FotterComponent } from '../menu/fotter.component'; | |
import { HeaderComponent } from '../menu/header.component'; | |
import { EmployeeListComponent } from '../employee/employeeList.component'; | |
@Component({ |
NewerOlder