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的更多相关文章

  1. HBase 数据模型(Data Model)

    HBase Data Model--HBase 数据模型(翻译) 在HBase中,数据是存储在有行有列的表格中.这是与关系型数据库重复的术语,并不是有用的类比.相反,HBase可以被认为是一个多维度的 ...

  2. PowerDesigner从Physical Data Model转Excel

    参考资料:http://www.cnblogs.com/hggc/archive/2013/10/15/3369857.html 由于有把ER图转Excel的需求,幸运地找到一个可用脚本,稍做修改完成 ...

  3. ExtJS笔记 Ext.data.Model

    A Model represents some object that your application manages. For example, one might define a Model ...

  4. Entity Framework的核心 – EDM(Entity Data Model) 一

    http://blog.csdn.net/wangyongxia921/article/details/42061695 一.EnityFramework EnityFramework的全程是ADO. ...

  5. EF,ADO.NET Entity Data Model简要的笔记

    1. 新建一个项目,添加一个ADO.NET Entity Data Model的文件,此文件会生成所有的数据对象模型,如果是用vs2012生的话,在.Designer.cs里会出现“// Defaul ...

  6. Create Entity Data Model

    http://www.entityframeworktutorial.net/EntityFramework5/create-dbcontext-in-entity-framework5.aspx 官 ...

  7. 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 ...

  8. 自定义 ASP.NET Identity Data Model with EF

    One of the first issues you will likely encounter when getting started with ASP.NET Identity centers ...

  9. Data Model for Message Receiver

    1. Physical Data Model 2. SQL Statements drop database MessageReceiver go /*======================== ...

随机推荐

  1. POJ1007-DNA Sorting-ACM

    DNA Sorting Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 83442   Accepted: 33584 Des ...

  2. JQuery解析XML数据的几个例子

    用JavaScript解析XML数据是常见的编程任务,JavaScript能做的,JQuery当然也能做.下面我们来总结几个使用JQuery解析XML的例子. 第一种方案: <script ty ...

  3. Lua 5.1 for Delphi 2010

    This is a Lua 5.1 Wrapper for Delphi 2009 and Delphi 2010 which automatically creates OOP callback f ...

  4. uboot使用tftp下载时出现“checksum bad”问题原因分析

    一.问题 二.原因分析 你的虚拟机是不是这样设置的呢? 如果是的话,请看下边的解释: 使用NAT模式,就是让虚拟系统借助NAT(网络地址转换)功能,通过宿主机器所在的网络来访问公网.也就是说,使用NA ...

  5. Unity网络斗地主 服务端

    Unity网络斗地主  服务端 @by梦想之家2工作室 阿龙 已经做好了服务器框架,并且能实现服务器给客户端分牌的问题!

  6. Unity3d开发IOS游戏 基础

    Unity3d开发IOS游戏 基础 @阿龙 -  649998群 1.先说明两个问题,我在WIN7下面的U3D里面,用了雅黑字体,但是导出为ios后,字体就看不见了,这是为什么呢?这是需要在MAC下找 ...

  7. 【HDOJ】3419 The Three Groups

    记忆化搜索. /* 3419 */ #include <cstdio> #include <cstring> #include <cstdlib> #define ...

  8. socket编程:客户端与服务器间的连接以及各函数的用法

    在认真的看UNP之前,一直被socket编程说的云里雾里,今天我要让大家从整天上认识socket编程,让我们知道socket编程的整个流程和各个函数的用法.这样:我们在写一些简单的socket编程时就 ...

  9. [LeetCode#55, 45]Jump Game, Jump Game II

    The problem: Given an array of non-negative integers, you are initially positioned at the first inde ...

  10. 「Poetize7」足球比赛

    描述 Description SJZEZ和TSYZ正在进行一轮足球联谊赛,根据规则,这轮比赛有两场,一场在SJZEZ的主场进行,一场在TSYZ的主场进行.胜负判断标准如下:1.在两场比赛中进球总数较多 ...