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. 第八篇、SVN在Mac上使用

    Mac自带svn软件 1.创建目录 svn-repository/source-code 2.svnadmin create /Users/liaokailin/svn-repository/sour ...

  2. confluence的权限管理

    上一篇解讲如何破解,安装confluence5.8.10,这次主要是看权限管理的实现.因为公司对知识的管理不仅是简单的分享,还要求不同权限的人看到不同的内容,所以在一开始就需要对权限这一块有所了解,以 ...

  3. 安装完 MySQL 后必须调整的 10 项配置

    原文出处: mysqlperformanceblog   译文出处:开源中国   欢迎分享原创到伯乐头条 当我们被人雇来监测MySQL性能时,人们希望我们能够检视一下MySQL配置然后给出一些提高建议 ...

  4. PHP 字符串常用方法

    implode(“”,“”)-->字符串分割方法,第一个参数以什么样的形式分割,第二个参数需要分割的字符串 数组操作 is_array(),判断这个数是否是一个数组

  5. 如何正确的使用uwsgi

    简单的安装过程可以在这里找到,这里主要说一下如何配置uwsgi的服务,将uwsgi服务加入系统进程,你可以使用如下两种方式安装 apt-get apt-get install uwsgi 该命令会自动 ...

  6. uboot main_loop函数分析

    一.概述    main_loop()函数做的都是与具体平台无关的工作.主要包括的工作如下: (1)初始化启动次数限制机制 (2)Modem功能 (3)设置软件版本号 (4)启动延迟 (5)读取命令, ...

  7. .NET 4.0 使用 asyn await

    .NET 4.0 也可以使用asyn await 使用nuget 搜索await即可发现微软官方包,安装导项目就可以使用了.   参考:http://stackoverflow.com/questio ...

  8. cadence遇到的问题(持续更新)

    1.画了DB9的封装,共十一个焊盘,其中两个是机械焊盘,在绘制PCB板时,想要将其接地,但无法连接,如图所示 因为是机械焊盘,所以无法用更改logic的方法进行网络更改,现在只发现一个办法,就是更改封 ...

  9. 转:使用xhprof进行线上PHP性能追踪及分析

    原文来自于:http://avnpc.com/pages/profiler-php-performance-online-by-xhprof 原创作者:AlloVince 之前一直使用基于Xdebug ...

  10. 理解Java(StringBuffer和StringBuilder)

    StringBuffer可实现同步,StringBuilder线程不安全. 翻译自Java API英文文档 本质 StringBuffer 和 StringBuilder 均表示一个可变字符序列 这个 ...