在angular2中显示验证错误消息时出错

时间:2016-11-07 12:10:32

标签: node.js html5 angular

我正在使用angular2js + nodejs,在显示textarea的错误验证时出错,输入类型="文本"在表格上

错误是:

enter image description here

以下是我的组件代码,模块,html

**Component File**

import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { AdventureService } from '../../services/adventure.service';

@Component({
  moduleId: module.id,
  selector: 'listing-details',
  templateUrl: 'details.component.html',
  styleUrls: ['details.component.css']
 })

export class DetailsComponent implements OnInit {
 description:string = '';
 gearRequired:string[] = [];
 policies:string[] = [];

private shortAdventureInfo:any;

constructor(private router:Router, public adventureService:AdventureService) {
  }

ngOnInit() {
this.shortAdventureInfo = AdventureService.shortAdventureInfo;
}

saveSpecificDetails() {
  let data = {
  description: this.description,
  gearRequired: this.gearRequired,
  policies: this.policies
};
  this.adventureService.saveSpecificAdventureDetails(AdventureService.shortAdventureInfo.id, data)
  .subscribe(
    response => {
      this.router.navigate(['/create-listing/location']);
    },
      <!--err => console.error(err.json())-->
    );
 }

}

=============================================== =====================    模块文件:

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { DetailsComponent } from './index';
import { FormsModule } from "@angular/forms";

@NgModule({
 imports: [CommonModule,FormsModule],
 declarations: [DetailsComponent],
 exports: [DetailsComponent],
 providers: []
})
export class DetailsModule { }

=============================================== =====================    HTML文件:

 <div class="col-xs-12 col-sm-12 col-md-5 nopadding pull-left step2_left">
              <form #myformForm="ngForm" class="float-label" spellcheck="false">
                <div class="control col-xs-12 col-sm-12 col-md-12 nopadding">
                <!-- (keyup) ="addDesc(description.value);" -->
                  <div *ngIf="description.errors && description.dirty && description.touched"
                         class="validation-error">
                    <div [hidden]="!description.errors.required">
                      <p>Description is required</p>
                    </div>
                    <!-- <div [hidden]="!description.errors.minlength">
                      <p>Description must be at least 5 characters long.</p>
                    </div>
                    <div [hidden]="!description.errors.maxlength">
                      <p>Description cannot be more than 1500 characters long.</p>
                    </div> -->
                  </div>
                  <textarea type="text" cols="" rows="14" 
                  placeholder="Description (Max. 1500 Characters are allowed)"
                  required [attr.maxlength]="1500"
                  [style.border-color]="getDescStyle(description.value)"
                  [(ngModel)] = "shortAdventureInfo.description"
                  (blur) = "addDesc(description.value)"
                  name="description" #description="ngModel"></textarea>
                  <label for="When you arrive">Description<br>
                    <span>What should adventurers expect from this adventure in terms of new experiences and/or physical exertion?</span></label>
                </div>
              </form>
            </div>

任何人都可以帮我解决我的错误吗? 提前谢谢。

1 个答案:

答案 0 :(得分:1)

错误提到DetailsComponent.getDescStyles - 所以尝试在那里寻找错误