未捕获的错误：模板语法错误没有这样的指令与EXPORTAS

Question

我已经使用这个link做当我试图建立我的角4应用程序，我得到这个错误我已经复制此链接中的代码堆栈平均聊天应用。我的节点服务器工作正常。有某种解析错误的我谷歌，但未能解决问题

这里是我的chat.component.html文件就像在链接

<div class="container"> 
<div class="row"> 
    <div class="col-md-5"> 
     <div class="panel panel-primary" *ngIf="joinned; else joinroom"> 
      <div class="panel-heading"> 
       <span class="glyphicon glyphicon-comment"></span> {{ msgData.room }} 
       <div class="btn-group pull-right"> 
        <button type="button" class="btn btn-default btn-xs" (click)="logout()"> 
         Logout 
        </button> 
       </div> 
      </div> 
      <div #scrollMe class="panel-body"> 
       <ul class="chat"> 
        <li *ngFor="let c of chats"> 
        <div class="left clearfix" *ngIf="c.nickname===msgData.nickname; else rightchat"> 
         <span class="chat-img pull-left"> 
         <img src="http://placehold.it/50/55C1E7/fff&text=ME" alt="User Avatar" class="img-circle" /> 
         </span> 
         <div class="chat-body clearfix"> 
          <div class="header"> 
           <strong class="primary-font">{{ c.nickname }}</strong> <small class="pull-right text-muted"> 
            <span class="glyphicon glyphicon-time"></span>{{ c.updated_at | date: 'medium' }}</small> 
          </div> 
          <p>{{ c.message }}</p> 
         </div> 
        </div> 
        <ng-template #rightchat> 
         <div class="right clearfix"> 
         <span class="chat-img pull-right"> 
          <img src="http://placehold.it/50/FA6F57/fff&text=U" alt="User Avatar" class="img-circle" /> 
         </span> 
         <div class="chat-body clearfix"> 
          <div class="header"> 
           <small class=" text-muted"><span class="glyphicon glyphicon-time"></span>{{ c.updated_at | date: 'medium' }}</small> 
           <strong class="pull-right primary-font">{{ c.nickname }}</strong> 
          </div> 
          <p>{{ c.message }}</p> 
         </div> 
         </div> 
        </ng-template> 
        </li> 
       </ul> 
      </div> 
      <div class="panel-footer"> 
      <form (ngSubmit)="sendMessage()" #msgForm="ngForm"> 
       <div class="input-group"> 
        <input type="hidden" [(ngModel)]="msgData.room" name="room" /> 
        <input type="hidden" [(ngModel)]="msgData.nickname" name="nickname" /> 
        <input id="btn-input" type="text" [(ngModel)]="msgData.message" name="message" class="form-control input-sm" placeholder="Type your message here..." required="" /> 
        <span class="input-group-btn"> 
         <button class="btn btn-warning btn-sm" id="btn-chat" [disabled]="!msgForm.form.valid"> 
          Send</button> 
        </span> 
       </div> 
      </form> 
      </div> 
     </div> 
     <ng-template #joinroom> 
     <div class="panel panel-primary"> 
      <div class="panel-body"> 
      <h1>Select Chat Room</h1> 
      <form (ngSubmit)="joinRoom()" #joinForm="ngForm"> 
       <div class="form-group"> 
       <input type="text" class="form-control" [(ngModel)]="newUser.nickname" name="nickname" placeholder="Nickname" required="" /> 
       </div> 
       <div class="form-group"> 
       <select class="form-control" [(ngModel)]="newUser.room" name="room" required=""> 
        <option>Select Room</option> 
        <option value="Javascript">Javascript</option> 
        <option value="Java">Java</option> 
        <option value="Python">Python</option> 
       </select> 
       </div> 
       <div class="form-group"> 
       <button type="submit" class="btn btn-success" [disabled]="!joinForm.form.valid">Join</button> 
       </div> 
      </form> 
      </div> 
     </div> 
     </ng-template> 
    </div> 
</div> 
</div> 

这里是我的app.module.ts文件

import { BrowserModule } from '@angular/platform-browser'; 
import { NgModule } from '@angular/core'; 
import { ChatService } from './chat.service'; 
import { HttpModule , JsonpModule } from '@angular/http'; 
import { HttpClientModule } from '@angular/common/http'; 

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

@NgModule({ 
declarations: [ 
AppComponent, 
ChatComponent 
], 
imports: [ 
BrowserModule, 
HttpClientModule, 
HttpModule 
], 
providers: [ChatService], 
bootstrap: [AppComponent] 
}) 
export class AppModule { } 

这可能是这个错误的soltion像下面

Answer 1

进口形式模块的module.ts

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

@NgModule({ 
    imports: [ 
     FormsModule 
    ] 

}) 
export class Module { }