Angular 2 Radio button binding

import {Component} from '@angular/core';

@Component({
  selector: 'my-app',
  template: `
    <h2>{{title}}</h2>
      <input type="radio" name="options" [(ngModel)]="model.options" value="1">
      my one
      <input type="radio" name="options" [(ngModel)]="model.options" value="2">
      my two
      <input type="radio" name="options" [(ngModel)]="model.options" value="3">
      my three

    <p><button (click)="model.options = '1'">set one</button>
    <p>{{debug}}
  `
})
export class AppComponent {
  title = "Angular 2 RC.6 - radio buttons";
  names  = ["a1", "b1", "a2", "b2"];
  radioItems = [1, 2, 3];
  model = { options: '2' };
  constructor() { console.clear(); }
  get debug() { 
    return JSON.stringify(this.model) + "\n" 
    + JSON.stringify(this.names.filter(
      function(item, index, obj){return item.indexOf("1")>=0}); });
  }
}

body   { 
  font-family: Arial, Helvetica; 
  color: #444;
}

<!DOCTYPE html>
<html>
  <head>
    <title>First App</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="styles.css">
    <!-- 1. Load libraries -->
      <!-- Polyfill(s) for older browsers -->
      <script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.35.0/es6-shim.min.js"></script>

    <script src="https://npmcdn.com/zone.js@0.6.12?main=browser"></script>
    <script src="https://npmcdn.com/reflect-metadata@0.1.3"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.27/system.js"></script>
    <script src="https://npmcdn.com/typescript@1.8.10/lib/typescript.js"></script>

    <!-- 2. Configure SystemJS -->
    <script src="systemjs.config.js"></script>
    <script>
      System.import('app').catch(function(err){ console.error(err);  });
    </script>
  </head>

  <body>
    <my-app>loading...</my-app>
  </body>
</html>

import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';

import {AppModule} from './app.module';

platformBrowserDynamic().bootstrapModule(AppModule);

/**
 * PLUNKER VERSION (based on systemjs.config.js in angular.io)
 * System configuration for Angular 2 samples
 * Adjust as necessary for your application needs.
 * Override at the last minute with global.filterSystemConfig (as plunkers do)
 */
(function(global) {

  var ngVer = '@2.0.0-rc.6'; // lock in the angular package version; do not let it float to current!

  //map tells the System loader where to look for things
  var  map = {
    'app':                        'app', // 'dist',
    'rxjs':                       'https://npmcdn.com/rxjs@5.0.0-beta.11',
    '@angular/forms':             'https://npmcdn.com/@angular/forms@0.2.0',
    //'angular2-in-memory-web-api': 'https://npmcdn.com/angular2-in-memory-web-api' // get latest
  };

  //packages tells the System loader how to load when no filename and/or no extension
  var packages = {
    'app':                        { main: 'main.ts',  defaultExtension: 'ts' },
//    '@angular/forms':             { main: 'index.js', defaultExtension: 'js' },
    //'rxjs':                       { defaultExtension: 'js' },
    //'angular2-in-memory-web-api': { defaultExtension: 'js' },
  };

  var packageNames = [
    '@angular/common',
    '@angular/compiler',
    '@angular/core',
    //'@angular/http',
    '@angular/forms',
    '@angular/platform-browser',
    '@angular/platform-browser-dynamic',
    //'@angular/router',
    //'@angular/router-deprecated',
    //'@angular/upgrade',
  ];

  // add map entries for angular packages in the form '@angular/common': 'https://npmcdn.com/@angular/common@0.0.0-3?main=browser'
  packageNames.forEach(function(pkgName) {
    map[pkgName] = 'https://npmcdn.com/' + pkgName + ngVer;
  });

  // add package entries for angular packages in the form '@angular/common': { main: 'index.js', defaultExtension: 'js' }
  packageNames.forEach(function(pkgName) {
    packages[pkgName] = { main: 'index.js', defaultExtension: 'js' };
  });

  var config = {
    transpiler: 'typescript',
    typescriptOptions: {
      emitDecoratorMetadata: true
    },
    map: map,
    packages: packages
  }

  // filterSystemConfig - index.html's chance to modify config before we register it.
  if (global.filterSystemConfig) { 
    global.filterSystemConfig(config);
  }

  System.config(config);
})(this);


/*
Copyright 2016 Google Inc. All Rights Reserved.
Use of this source code is governed by an MIT-style license that
can be found in the LICENSE file at http://angular.io/license
*/

import {NgModule, enableProdMode} from '@angular/core';
import {FormsModule} from '@angular/forms';
import {BrowserModule} from '@angular/platform-browser';

import {AppComponent} from './app.component';

@NgModule({
    imports: [
        BrowserModule,
        FormsModule
    ],
    declarations: [
        AppComponent,
    ],
    bootstrap: [ AppComponent ]
})

export class AppModule {}