[Angular 2] Using ng-model for two-way binding
2015-10-26 02:38
661 查看
Two-way binding still exists in Angular 2 and ng-model makes it simple. The syntax is a combination of the [input] and (output) syntax to represent that the data is being pushed out and pulled in.
import {Component, View, FORM_DIRECTIVES} from "angular2/angular2"; import {TodoService} from "./todoService"; @Component({ selector: 'todo-input' }) @View({ directives: [FORM_DIRECTIVES], template: ` <form action="" (ng-submit)="onSubmit()"> <input type="text" [(ng-model)]="todoModule">{{todoModule}} </form> ` }) export class TodoInput{ todoModule; constructor( //@Inject(TodoService) todoService public todoService:TodoService ){ this.todoService = todoService; console.log(todoService); } onSubmit(){ this.todoService.addTodo(this.todoModule); } }
相关文章推荐
- [Angular 2] ngFor
- ng-cloak解决angularJS中的闪烁
- angular.bind使用心得
- angularjs中常用的工具方法
- Angular引入百分比过滤器
- AngularJS 表单提交后显示验证信息与失焦后显示验证信息
- AngularJs angular.bind、angular.bootstrap、angular.copy
- AngularJS入门教程:日期格式化
- angularjs使用ng-switch不用包含在html元素中
- angularjs使用ng-repeat不用包含在html元素中
- AngularJS: 使用Scope时的6个陷阱
- angularjs学习总结 详细教程(转载)
- AngularJs轻松入门
- AngularJs轻松入门
- AngularJs轻松入门
- AngularJS几个常用指令
- 12 Highly divisible triangular number - Project Euler
- angularJS实现无刷新文件下载
- Angularjs –– Expressions(表达式)
- Angular - Templates(模板)