ng2-timesheet, 一个timesheet.js的angular2复制版
2016-06-12 01:19
597 查看
一个 timesheet.js (JavaScript library for HTML5 & CSS3 time sheets) 的 Angular 2 复制版
用法:
效果:
源代码:
https://github.com/zhongzf/ng2-timesheet
用法:
npm install ng2-timesheet --save
app.component.ts
import { Component } from '@angular/core'; import { TimesheetItem, Timesheet, TimesheetComponent } from 'ng2-timesheet'; @Component({ moduleId: module.id, selector: 'my-app', templateUrl: 'app.component.html', directives: [TimesheetComponent] }) export class AppComponent { timesheet = new Timesheet(2002, 2014, [ new TimesheetItem('2002', '2002-09', 'A freaking awesome time', 'lorem'), new TimesheetItem('2002-06', '2003-09', 'Some great memories', 'ipsum'), new TimesheetItem('2003', '2004', 'Had very bad luck', 'default'), new TimesheetItem('2003-10', '2006', 'At least had fun', 'dolor'), new TimesheetItem('2005-02', '2006-05', 'Enjoyed those times as well', 'ipsum'), new TimesheetItem('2005-07', '2005-09', 'Bad luck again', 'default'), new TimesheetItem('2005-10', '2008', 'For a long time nothing happened', 'dolor'), new TimesheetItem('2008-01', '2009-05', 'LOST Season #4', 'lorem'), new TimesheetItem('2009-01', '2009-05', 'LOST Season #4', 'sit'), new TimesheetItem('2010-02', '2010-05', 'LOST Season #5', 'lorem'), new TimesheetItem('2008-09', '2010-06', 'FRINGE #1 & #2', 'ipsum') ]); }
app.component.html
<timesheet [timesheet]='timesheet'></timesheet>
效果:
源代码:
https://github.com/zhongzf/ng2-timesheet
相关文章推荐
- js 识别or 手机
- JS面向对象的程序设计
- jsp 获取根目录常用的标签${ctx }
- js引用在页面的位置
- 浏览器的复制到剪切板功能,兼容所有浏览器,悬浮层不能复制问题解决
- JS template string 神奇术
- js正则
- 各大json的使用
- jsp编译中的小细节
- JS缓冲运动
- JS--浏览器兼容之new Date
- 前端学习_Series2_01.JavaScript_01
- JS匀速运动
- JavaScript中this指针指向的彻底理解
- 前端学习总结(十八)ES6——新一代的javascript
- JavaScript按键拖动
- JavaScript鼠标拖动
- javascript中的对象详解,以及对象和原型链
- 《JavaScript学习笔记》:只能输入数字的文本框
- 【跟着子迟品 underscore】JavaScript 数组展开以及重要的内部方法 flatten