"exportAs"가 "ngForm"으로 설정된 지시문이 없습니다.

"exportAs"가 "ngForm"으로 설정된 지시문이 없습니다.

---

이 프로젝트 의존성을 갖는 것 :

  "dependencies": {
    "@angular/common": "2.0.0-rc.6",
    "@angular/compiler": "2.0.0-rc.6",
    "@angular/core": "2.0.0-rc.6",
    "@angular/forms": "2.0.0-rc.6",
    "@angular/http": "2.0.0-rc.6",
    "@angular/platform-browser": "2.0.0-rc.6",
    "@angular/platform-browser-dynamic": "2.0.0-rc.6",
    "@angular/router": "3.0.0-rc.2",
    "ng2-bootstrap": "^1.1.1",
    "reflect-metadata": "^0.1.8",
    "core-js": "^2.4.0",
    "es6-module-loader": "^0.17.8",
    "rxjs": "5.0.0-beta.11",
    "systemjs": "0.19.27",
    "zone.js": "0.6.17",
    "jquery": "3.0.0",
  }

그리고이 로그인 템플릿 :

<form #loginForm="ngForm" (ng-submit)="authenticate(loginForm.value)">
</form>

그리고이 로그인 구성 요소 :

import { Component } from '@angular/core';
import {Http, Headers}  from '@angular/http';
@Component({
    moduleId: module.id,
    selector: 'login-cmp',
    templateUrl: 'login.component.html'
})
export class LoginComponent {
  constructor($http: Http) {
    this.$http = $http;
  }
  authenticate(data) {
   ... 
  }
}

이 오류가 있습니다 :

zone.js?1474211973422:484 Unhandled Promise rejection: Template parse errors:    
There is no directive with "exportAs" set to "ngForm" ("
            <form [ERROR ->]#loginForm="ngForm" 
(ngsubmit)="authenticate(loginForm.value)">

---

import { FormsModule }   from '@angular/forms';

@NgModule({
  imports: [
             BrowserModule,

             FormsModule      //<----------make sure you have added this.
           ],
  ....
})

---

당신은 수입에이 FormsModule루트 AppModule뿐만 아니라에 뿐만 아니라 모든 서브 모듈로 어떤 각도 형태 지시어를 사용합니다.

// SubModule A

import { CommonModule } from '@angular/common';
import { FormsModule }   from '@angular/forms';

@NgModule({
  imports: [
    CommonModule,
    FormsModule      //<----------make sure you have added this.
  ],
  ....
})

---

나는 이것이 오래된 게시물이라는 것을 알고 있지만 내 솔루션을 공유하고 싶습니다. 이 오류를 해결하기 위해 imports [] 배열 에 " ReactiveFormsModule "을 추가했습니다.

오류 : "exportAs"가 "ngForm"( "으로 설정된 지시문이 없습니다.

고치다:

module.ts

'@ angular / forms'에서 {FormsModule, ReactiveFormsModule } 가져 오기

 imports: [
    BrowserModule,
    FormsModule , 
    ReactiveFormsModule
  ],

---

import { FormsModule }   from '@angular/forms';

@NgModule({
  imports: [FormsModule],
  ...
})

---

(다른 사람이 나처럼 눈이 멀었을 경우를 대비하여) form FTW ! <form>태그 를 사용하십시오

wont work:

<div (ngSubmit)="search()" #f="ngForm" class="input-group">
    <span class="input-group-btn">
      <button class="btn btn-secondary" type="submit">Go!</button>
    </span>
    <input type="text" ngModel class="form-control" name="search" placeholder="Search..." aria-label="Search...">
</div>

works like charm:

 <form (ngSubmit)="search()" #f="ngForm" class="input-group">
            <span class="input-group-btn">
              <button class="btn btn-secondary" type="submit">Go!</button>
            </span>
            <input type="text" ngModel class="form-control" name="search" placeholder="Search..." aria-label="Search...">
</form>

---

check whether you import FormsModule. There's no ngControl in the new forms angular 2 release version. you have to change your template to as an example

<div class="row">
    <div class="form-group col-sm-7 col-md-5">
        <label for="name">Name</label>
        <input type="text" class="form-control" required
               [(ngModel)]="user.name"
               name="name" #name="ngModel">
        <div [hidden]="name.valid || name.pristine" class="alert alert-danger">
            Name is required
        </div>
    </div>
</div>

---

I faced this issue, but none of the answers here worked for me. I googled and found that FormsModule not shared with Feature Modules

So If your form is in a featured module, then you have to import and add the FromsModule there.

Please ref: https://github.com/angular/angular/issues/11365

---

Two Things you have to care..

1. If you using the sub module, you have to import the FormModule in that sub module.

           **imports:[CommonModule,HttpModule,FormsModule]**
   

2. you have to exports the FormModule in the module

       **exports:[FormsModule],**
   

   so together it looks like imports:[CommonModule,HttpModule,FormsModule], exports:[FormsModule],

3. in Top u have to import the FormsModule

   import {FormsModule} from '@angular/forms';

---

if you are using only the app.module.ts then

no need to export.. only import required

---

In addition to import the form module in login component ts file you need to import NgForm also.

import { NgForm } from '@angular/forms';

This resolved my issue

---

You must import the FormsModule and then place it in the section of imports.

import { FormsModule } from '@angular/forms';

---

Simple if you have not import module then import and declare import { FormsModule } from '@angular/forms';

and if you did then you just need to remove formControlName='whatever' from input fields.

---

You should terminate app with ctrl+c and re run it with ng serve, if you did not include FormsModule into you app.module file imports array, and then added it later, angular does not know it, it does not re-scan modules, you should restart app so angular could see that new module is included, after what it will included all features of template drive approach

---

I had the same issue and solved it by updating all dependencies (package.json) with the following command npm update -D && npm update -S

As @Günter Zöchbauer pointed out, make sure to include the FormsModule first.

참고URL : https://stackoverflow.com/questions/39559296/there-is-no-directive-with-exportas-set-to-ngform