[Angular 2] Adding a data model
Instead of add todo as a string, we create a data model:
export class TodoModel{
constructor(
public title: string = ""
){}
}
export class TodoService{
todos: TodoModel[] = [
new TodoModel('eat'),
new TodoModel('sleep'),
new TodoModel('work')
];
addTodo(value: TodoModel):void {
this.todos.push(value);
}
}
todoInput.ts
import {Component, View, FORM_DIRECTIVES} from "angular2/angular2";
import {TodoService, TodoModel} from "./todoService";
@Component({
selector: 'todo-input'
})
@View({
directives: [FORM_DIRECTIVES],
template: `
<form action="" (ng-submit)="onSubmit()">
<input type="text" [(ng-model)]="todoModule.title">
</form>
`
})
export class TodoInput{
todoModule:TodoModel = new TodoModel();
constructor(
//@Inject(TodoService) todoService
public todoService:TodoService
){
this.todoService = todoService;
}
onSubmit(){
this.todoService.addTodo(this.todoModule);
this.todoModule = new TodoModel(); // reinit the this.todoModule
}
}
[Angular 2] Adding a data model的更多相关文章
- HBase 数据模型(Data Model)
HBase Data Model--HBase 数据模型(翻译) 在HBase中,数据是存储在有行有列的表格中.这是与关系型数据库重复的术语,并不是有用的类比.相反,HBase可以被认为是一个多维度的 ...
- PowerDesigner从Physical Data Model转Excel
参考资料:http://www.cnblogs.com/hggc/archive/2013/10/15/3369857.html 由于有把ER图转Excel的需求,幸运地找到一个可用脚本,稍做修改完成 ...
- ExtJS笔记 Ext.data.Model
A Model represents some object that your application manages. For example, one might define a Model ...
- Entity Framework的核心 – EDM(Entity Data Model) 一
http://blog.csdn.net/wangyongxia921/article/details/42061695 一.EnityFramework EnityFramework的全程是ADO. ...
- EF,ADO.NET Entity Data Model简要的笔记
1. 新建一个项目,添加一个ADO.NET Entity Data Model的文件,此文件会生成所有的数据对象模型,如果是用vs2012生的话,在.Designer.cs里会出现“// Defaul ...
- Create Entity Data Model
http://www.entityframeworktutorial.net/EntityFramework5/create-dbcontext-in-entity-framework5.aspx 官 ...
- Visualizing the Git data model
I wrote a small tool git-graph.py over the weekend which can be used to generate the object graph of ...
- 自定义 ASP.NET Identity Data Model with EF
One of the first issues you will likely encounter when getting started with ASP.NET Identity centers ...
- Data Model for Message Receiver
1. Physical Data Model 2. SQL Statements drop database MessageReceiver go /*======================== ...
随机推荐
- Window.onload事件
window.onload是一个事件,当文档加载完成之后就会触发该事件,可以为此事件注册事件处理函数,并将要执行的脚本代码放在事件处理函数中,于是就可以避免获取不到对象的情况
- 浏览器中的WebSocket("ws://127.0.0.1:9988");
<script type="text/javascript"> function WebSocketTest() { if ("WebSocket" ...
- echshop jquery与transpart冲突解决?
<script type="text/javascript">$(function() {window.__Object_toJSONString = Object.p ...
- 局部变量存储区域静态变量存储区域static变量存储区域
局部变量存储区域静态变量存储区域static变量存储区域 常见的存储区域可分为: 1.栈 由编译器在需要的时候分配,在不需要的时候自动清楚的变量的存储区.里面的变量通常是局部变量.函数参数等. 2.堆 ...
- JQuery 判断IPad、IPhone、Android是横屏还是竖屏(Window.Orientation实现)
在ipad.iphone网页开发中,我们很可能需要判断是横屏或者竖屏.下面就来介绍如何用 jQuery 判断iPad.iPhone.Android是横屏还是竖屏的方法. 代码如下: function ...
- WordPress BulletProof Security插件多个HTML注入漏洞
漏洞名称: WordPress BulletProof Security插件多个HTML注入漏洞 CNNVD编号: CNNVD-201308-023 发布时间: 2013-08-06 更新时间: 20 ...
- 「Poetize6」Candle
描述 蜡烛商店中有10种蜡烛,形状分别是0~9这10个数字,不过对于每种蜡烛,商店的存货量仅有一根.另外,忘川沧月已经有了一个"+"形状的蜡烛.忘川沧月想购买一些蜡烛,使得他的家族 ...
- [Poetize I]黑魔法师之门
描述 Description applepi被囚禁的地点只有一扇门,当地 人称它为“黑魔法师之门”.这扇门上画着一张无向无权图,而打开这扇门的密码就是图中[每个点的度数大于零且都是偶数]的子图的个数对 ...
- Qt入门(7)——窗口几何结构
QWidget提供了几个处理窗口几何结构的函数.这些函数中的几个操作纯客户区域(例如不包含窗口框架的窗口),其它一些包括窗口框架.它们之间的区别在某种意义上被完成覆盖明显地最普通的方法.包括窗口的框架 ...
- weblogic启动报错之建域时未指定AdminServer的监听IP的引起的子节点启动故障
各子节点不能启动,查看日志,报错如下: Unable to establish JMX Connectivity with the Adminstration Server AdminServer a ...