Book Image

Getting Started with Angular - Second edition - Second Edition

By : Minko Gechev
Book Image

Getting Started with Angular - Second edition - Second Edition

By: Minko Gechev

Overview of this book

Want to build quick and robust web applications with Angular? This book is the quickest way to get to grips with Angular and take advantage of all its new features.
Table of Contents (16 chapters)
Getting Started with Angular Second Edition
Credits
Foreword
About the Author
About the Reviewer
www.PacktPub.com
Customer Feedback
Preface

Two-way data binding with Angular


One of the most famous rumors about Angular 2 was that the two-way data binding functionality was removed because of the enforced unidirectional data flow. This is not exactly true; the Angular's form module implements a directive with the selector [(ngModel)] (we'll also refer to this directive as NgModel, because of the name of its controller), which allows us to easily achieve data binding in two directions: from the view to the model and from the model to the view.

Let's take a look at the following simple component:

// ch6/ts/simple-two-way-data-binding/app.ts 
 
import {Component, NgModule} from '@angular/core';
import {BrowserModule} from '@angular/platform-browser';
import {FormsModule} from '@angular/forms';
import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';

@Component({
 selector: 'app',
 template: `
  <input type="text" [(ngModel)]="name">
  <div>{{name}}...