File
Implements
Metadata
| selector |
.tasksBox |
| styleUrls |
tasks-box.component.css |
| templateUrl |
./tasks-box.component.html |
Index
Properties
|
|
|
Methods
|
|
|
Inputs
|
|
|
Methods
|
Public ngOnInit
|
ngOnInit()
|
|
|
|
|
|
tasksLength
|
tasksLength: literal type
|
Type : literal type
|
|
|
import { Component, OnInit, Input } from '@angular/core';
import { Message } from '../../models/message';
@Component( {
/* tslint:disable */
selector: '.tasksBox',
/* tslint:enable */
styleUrls: ['./tasks-box.component.css'],
templateUrl: './tasks-box.component.html'
})
export class TasksBoxComponent implements OnInit {
messages: Message[];
tasksLength: {} = { 0: 0 };
@Input() public user;
constructor() {}
public ngOnInit() {}
}
<!-- Menu Toggle Button -->
<a href="#" class="dropdown-toggle" data-toggle="dropdown"> <i
class="fa fa-flag-o"></i> <span class="label label-danger">9</span>
</a>
<ul class="dropdown-menu">
<li class="header">{{ 'TASKBOX.COUNT' | translate:tasksLength }}</li>
<li>
<!-- Inner menu: contains the tasks -->
<ul class="menu">
<li>
<!-- Task item --> <a href="#"> <!-- Task title and progress text -->
<h3>
Design some buttons <small class="pull-right">20%</small>
</h3> <!-- The progress bar -->
<div class="progress xs">
<!-- Change the css width attribute to simulate progress -->
<div class="progress-bar progress-bar-aqua" style="width: 20%"
role="progressbar" aria-valuenow="20" aria-valuemin="0"
aria-valuemax="100">
<span class="sr-only">20% Complete</span>
</div>
</div>
</a>
</li>
<!-- end task item -->
</ul>
</li>
<li class="footer"><a href="#">{{ 'TASKBOX.FOOTER' | translate
}}</a></li>
</ul>
Legend
Html element with directive