Angular2无法使用JavaScript导入FormsModule

Question

I am doing the Angular2 Heroes Tutorial: https://angular.io/docs/ts/latest/tutorial/toh-pt1.html in plain Javascript (not Typescript) and i am having trouble to Import the Forms Module as mentioned: (description is only for Typescript):

Before we can use two-way data binding for form inputs, we need to import the FormsModule package in our Angular module. We add it to the NgModule decorator's imports array. This array contains the list of external modules used by our application.

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule }   from '@angular/forms';
import { AppComponent }  from './app.component';
@NgModule({
  imports: [
    BrowserModule,
    FormsModule
  ],
  declarations: [
    AppComponent
  ],
  bootstrap: [ AppComponent ]
})
export class AppModule { }

When i am adding the Forms module to my app.module.js import array, it fails to find the module:

zone.js:129 Uncaught Error: Unexpected value 'undefined' imported by the module 'class2'

Here is my app.module.js:

(function(app) {
  app.AppModule =
    ng.core.NgModule({
      imports: [ ng.platformBrowser.BrowserModule, ng.common.FORM_DIRECTIVES],
      declarations: [ app.AppComponent],
      bootstrap: [ app.AppComponent ]
    })
    .Class({
      constructor: function() {}
    });
})(window.app || (window.app = {}));

in my node_modules folder the Forms module exists. If i remove "ng.common.FORM_DIRECTIVES" from the imports array, no error is thrown.

The Content of console.dir(ng) is:

Object
    common:Object
    compiler:Object
    core:Object
    coreTokens:Object
    platformBrowser:Object
    platformBrowserDynamic:Object
    probe
    :
    inspectNativeElement(element /** TODO #9100 */)
    __proto__:Object

The content of console.dir(ng.forms) is:

undefined

Answer 1

I am sorry, i found the error. As so often it was nothing having to do with typescript or angular, i just had to add the script tag in the index.html file to load the forms.umd.js:

<script src="../node_modules/@angular/forms/bundles/forms.umd.js"></script>

now i can import the Forms Module with the following code and i can use the ngModule functionality:

ng.core.NgModule({
  imports: [ ng.platformBrowser.BrowserModule, ng.forms.FormsModule],
  declarations: [ app.AppComponent],
  bootstrap: [ app.AppComponent ]
})

Answer 2

Try using import { FORM_DIRECTIVES } from 'angular2/common';

Source: Angular 2 two way binding using ngModel is not working

EDIT:

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FORM_DIRECTIVES } from 'angular2/common';
import { AppComponent }  from './app.component';
@NgModule({
  imports: [
    BrowserModule,
    FORM_DIRECTIVES
  ],
  declarations: [
    AppComponent
  ],
  bootstrap: [ AppComponent ]
})
export class AppModule { }

If this doesn't work, post the console.dir(ng); again( with this code in use ).