Angular 财产';初级';不存在于类型';等级组件';

Angular 财产';初级';不存在于类型';等级组件';,angular,typescript,angular-material,angular-cli,angular2-aot,Angular,Typescript,Angular Material,Angular Cli,Angular2 Aot,在angular cli 1.0.1中创建项目产品时,出现以下错误: 错误 ng:///root/Desktop/KRA(Angular4)/client/src/app/grade/grade.component.html (13,16):类型“GradeComponent”上不存在属性“primary” Html代码文件: <md-card> <md-card-title>{{isNew?'Add':'Edit'}} Grade</md-card-titl

在angular cli 1.0.1中创建项目产品时,出现以下错误:

错误 ng:///root/Desktop/KRA(Angular4)/client/src/app/grade/grade.component.html (13,16):类型“GradeComponent”上不存在属性“primary”

Html代码文件:

<md-card>
   <md-card-title>{{isNew?'Add':'Edit'}} Grade</md-card-title><hr>
   <md-card-content>
      <form [formGroup]="frmGrade">
         <div>
            <md-input-container class="half" [dividerColor]="(frmGrade.controls['grade'].hasError('required') && frmGrade.controls['grade'].touched)?'warn':'primary'"> 
            <input mdInput

               placeholder="Grade Name" 
               formControlName="grade" 
               maxlength="30"
               required
               />       
            </md-input-container>
         </div>
         <div>
            <md-input-container class="half" [dividerColor]="primary">
            <input mdInput placeholder="Grade Description (Optional)"
               formControlName="description"
               maxlength="100"

                />  
            </md-input-container>
         </div>
      </form>
   </md-card-content>
   <md-card-actions>
      <button  type="submit"
      md-raised-button color="primary"
      *ngIf='isNew' (click)="onAdd();false" 
      [disabled]='!frmGrade.valid'>
      Add
      </button>
      <button type="submit"
      md-raised-button 
      color="primary"
      *ngIf='!isNew' (click)="onUpdate();false" 
      [disabled]='!frmGrade.valid'>Update
      </button>
      <button md-raised-button 
         color="warn" 
         [routerLink]='["/grade-listing"]'>
      Cancel
      </button>
   </md-card-actions>
</md-card>

似乎您正在CLI中使用AOT,它尝试使用组件属性验证
绑定
,以获取编译时的错误

基本上,您还没有在组件上定义
primary
属性。绑定应该是使用带有
[]
(属性绑定)的属性

(在
'中包装主要内容
(单个qoute))


似乎您正在CLI中使用AOT,它尝试使用组件属性验证
绑定
,以获取编译时的错误

基本上,您还没有在组件上定义
primary
属性。绑定应该是使用带有
[]
(属性绑定)的属性

(在
'中包装主要内容
(单个qoute))


您应该根据组件的属性定义组件中的主变量。如果是某个颜色值,则应声明为
primary:string='red'

类型脚本文件:

import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute, Params } from '@angular/router';
import { Grade } from './grade';
import { FormGroup, FormBuilder , Validators } from '@angular/forms';
import {GradeService} from '../services/grade.service';
import {CoreService} from '../services/core.service'; 

@Component({
  selector: 'kra-grade',
  templateUrl: './grade.component.html'

})
export class GradeComponent implements OnInit {

  public isNew:boolean=true;
  public frmGrade: FormGroup;
  public subscription:any;
  public oldGrade:Grade;

  constructor(
    private formBuilder:FormBuilder ,
    private gradeService:GradeService,
    private router:Router,
    private activatedRoute:ActivatedRoute,
     private core :CoreService
  ) { }


 ngOnInit() {
   this.frmGrade = this.formBuilder.group({
     grade: ['', Validators.required],
     description: ''
   });

   if (typeof this.activatedRoute.snapshot.params['id'] != 'undefined') {
     this.setForUpdate();
   }
  }

  private setForUpdate() {
      this.isNew = false;
      this.gradeService
          .getOneGrade(this.activatedRoute.snapshot.params['id'])
          .subscribe(
              data => {
                  this.oldGrade = data,
                      this.frmGrade = this.formBuilder.group({
                          grade: [this.oldGrade.grade, Validators.required],
                          description: this.oldGrade.description
                      });
              },
              err => this.core.notify(this.core.ERROR_TITLE,this.core.SOMETHING_WRONG,0) 
          );
  }

  onAdd(){    
    if(this.frmGrade.dirty && this.frmGrade.valid){
      this.gradeService
        .addGrade(this.frmGrade.value)
        .subscribe(
            d => {
              if(d.error) this.core.notify(this.core.WARN_TITLE,d.message,0);
              else {
                this.core.notify(this.core.SUCCESS_TITLE,this.core.SUCCESSFULLY_ADDED,1);
                this.frmGrade.reset();
                this.router.navigate(['/grade-listing']);
              }
            },
            error => this.core.notify(this.core.ERROR_TITLE,this.core.SOMETHING_WRONG,0)
        );
    }
  }

  onUpdate(){
    if(this.frmGrade.dirty && this.frmGrade.valid){            
        this.gradeService
          .editGrade(this.oldGrade,this.frmGrade.value,this.activatedRoute.snapshot.params['id'])
          .subscribe( 
            d => {
              if (d.error) this.core.notify(this.core.WARN_TITLE, d.message, 0);
              else {
                this.core.notify(this.core.SUCCESS_TITLE, this.core.SUCCESSFULLY_CHANGE, 1);
                this.frmGrade.reset();
                this.router.navigate(['/grade-listing']);
              }
          },
          error => this.core.notify(this.core.ERROR_TITLE, this.core.SOMETHING_WRONG, 0),
          );
        }else if(!this.frmGrade.dirty){
        this.router.navigate(['/grade-listing']);
    }
    }

}
import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute, Params } from '@angular/router';
import { Grade } from './grade';
import { FormGroup, FormBuilder , Validators } from '@angular/forms';
import {GradeService} from '../services/grade.service';
import {CoreService} from '../services/core.service'; 

@Component({
  selector: 'kra-grade',
  templateUrl: './grade.component.html'

})
export class GradeComponent implements OnInit {

  public isNew:boolean=true;
  public frmGrade: FormGroup;
  public subscription:any;
  public oldGrade:Grade;
  public primary:string = 'red'; // dont know whether it is string or any other type

  constructor(
    private formBuilder:FormBuilder ,
    private gradeService:GradeService,
    private router:Router,
    private activatedRoute:ActivatedRoute,
     private core :CoreService
  ) { }


 ngOnInit() {
   this.frmGrade = this.formBuilder.group({
     grade: ['', Validators.required],
     description: ''
   });

   if (typeof this.activatedRoute.snapshot.params['id'] != 'undefined') {
     this.setForUpdate();
   }
  }

  private setForUpdate() {
      this.isNew = false;
      this.gradeService
          .getOneGrade(this.activatedRoute.snapshot.params['id'])
          .subscribe(
              data => {
                  this.oldGrade = data,
                      this.frmGrade = this.formBuilder.group({
                          grade: [this.oldGrade.grade, Validators.required],
                          description: this.oldGrade.description
                      });
              },
              err => this.core.notify(this.core.ERROR_TITLE,this.core.SOMETHING_WRONG,0) 
          );
  }

  onAdd(){    
    if(this.frmGrade.dirty && this.frmGrade.valid){
      this.gradeService
        .addGrade(this.frmGrade.value)
        .subscribe(
            d => {
              if(d.error) this.core.notify(this.core.WARN_TITLE,d.message,0);
              else {
                this.core.notify(this.core.SUCCESS_TITLE,this.core.SUCCESSFULLY_ADDED,1);
                this.frmGrade.reset();
                this.router.navigate(['/grade-listing']);
              }
            },
            error => this.core.notify(this.core.ERROR_TITLE,this.core.SOMETHING_WRONG,0)
        );
    }
  }

  onUpdate(){
    if(this.frmGrade.dirty && this.frmGrade.valid){            
        this.gradeService
          .editGrade(this.oldGrade,this.frmGrade.value,this.activatedRoute.snapshot.params['id'])
          .subscribe( 
            d => {
              if (d.error) this.core.notify(this.core.WARN_TITLE, d.message, 0);
              else {
                this.core.notify(this.core.SUCCESS_TITLE, this.core.SUCCESSFULLY_CHANGE, 1);
                this.frmGrade.reset();
                this.router.navigate(['/grade-listing']);
              }
          },
          error => this.core.notify(this.core.ERROR_TITLE, this.core.SOMETHING_WRONG, 0),
          );
        }else if(!this.frmGrade.dirty){
        this.router.navigate(['/grade-listing']);
    }
    }

}

您应该根据组件的属性定义组件中的主变量。如果是某个颜色值,则应声明为
primary:string='red'

类型脚本文件:

import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute, Params } from '@angular/router';
import { Grade } from './grade';
import { FormGroup, FormBuilder , Validators } from '@angular/forms';
import {GradeService} from '../services/grade.service';
import {CoreService} from '../services/core.service'; 

@Component({
  selector: 'kra-grade',
  templateUrl: './grade.component.html'

})
export class GradeComponent implements OnInit {

  public isNew:boolean=true;
  public frmGrade: FormGroup;
  public subscription:any;
  public oldGrade:Grade;

  constructor(
    private formBuilder:FormBuilder ,
    private gradeService:GradeService,
    private router:Router,
    private activatedRoute:ActivatedRoute,
     private core :CoreService
  ) { }


 ngOnInit() {
   this.frmGrade = this.formBuilder.group({
     grade: ['', Validators.required],
     description: ''
   });

   if (typeof this.activatedRoute.snapshot.params['id'] != 'undefined') {
     this.setForUpdate();
   }
  }

  private setForUpdate() {
      this.isNew = false;
      this.gradeService
          .getOneGrade(this.activatedRoute.snapshot.params['id'])
          .subscribe(
              data => {
                  this.oldGrade = data,
                      this.frmGrade = this.formBuilder.group({
                          grade: [this.oldGrade.grade, Validators.required],
                          description: this.oldGrade.description
                      });
              },
              err => this.core.notify(this.core.ERROR_TITLE,this.core.SOMETHING_WRONG,0) 
          );
  }

  onAdd(){    
    if(this.frmGrade.dirty && this.frmGrade.valid){
      this.gradeService
        .addGrade(this.frmGrade.value)
        .subscribe(
            d => {
              if(d.error) this.core.notify(this.core.WARN_TITLE,d.message,0);
              else {
                this.core.notify(this.core.SUCCESS_TITLE,this.core.SUCCESSFULLY_ADDED,1);
                this.frmGrade.reset();
                this.router.navigate(['/grade-listing']);
              }
            },
            error => this.core.notify(this.core.ERROR_TITLE,this.core.SOMETHING_WRONG,0)
        );
    }
  }

  onUpdate(){
    if(this.frmGrade.dirty && this.frmGrade.valid){            
        this.gradeService
          .editGrade(this.oldGrade,this.frmGrade.value,this.activatedRoute.snapshot.params['id'])
          .subscribe( 
            d => {
              if (d.error) this.core.notify(this.core.WARN_TITLE, d.message, 0);
              else {
                this.core.notify(this.core.SUCCESS_TITLE, this.core.SUCCESSFULLY_CHANGE, 1);
                this.frmGrade.reset();
                this.router.navigate(['/grade-listing']);
              }
          },
          error => this.core.notify(this.core.ERROR_TITLE, this.core.SOMETHING_WRONG, 0),
          );
        }else if(!this.frmGrade.dirty){
        this.router.navigate(['/grade-listing']);
    }
    }

}
import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute, Params } from '@angular/router';
import { Grade } from './grade';
import { FormGroup, FormBuilder , Validators } from '@angular/forms';
import {GradeService} from '../services/grade.service';
import {CoreService} from '../services/core.service'; 

@Component({
  selector: 'kra-grade',
  templateUrl: './grade.component.html'

})
export class GradeComponent implements OnInit {

  public isNew:boolean=true;
  public frmGrade: FormGroup;
  public subscription:any;
  public oldGrade:Grade;
  public primary:string = 'red'; // dont know whether it is string or any other type

  constructor(
    private formBuilder:FormBuilder ,
    private gradeService:GradeService,
    private router:Router,
    private activatedRoute:ActivatedRoute,
     private core :CoreService
  ) { }


 ngOnInit() {
   this.frmGrade = this.formBuilder.group({
     grade: ['', Validators.required],
     description: ''
   });

   if (typeof this.activatedRoute.snapshot.params['id'] != 'undefined') {
     this.setForUpdate();
   }
  }

  private setForUpdate() {
      this.isNew = false;
      this.gradeService
          .getOneGrade(this.activatedRoute.snapshot.params['id'])
          .subscribe(
              data => {
                  this.oldGrade = data,
                      this.frmGrade = this.formBuilder.group({
                          grade: [this.oldGrade.grade, Validators.required],
                          description: this.oldGrade.description
                      });
              },
              err => this.core.notify(this.core.ERROR_TITLE,this.core.SOMETHING_WRONG,0) 
          );
  }

  onAdd(){    
    if(this.frmGrade.dirty && this.frmGrade.valid){
      this.gradeService
        .addGrade(this.frmGrade.value)
        .subscribe(
            d => {
              if(d.error) this.core.notify(this.core.WARN_TITLE,d.message,0);
              else {
                this.core.notify(this.core.SUCCESS_TITLE,this.core.SUCCESSFULLY_ADDED,1);
                this.frmGrade.reset();
                this.router.navigate(['/grade-listing']);
              }
            },
            error => this.core.notify(this.core.ERROR_TITLE,this.core.SOMETHING_WRONG,0)
        );
    }
  }

  onUpdate(){
    if(this.frmGrade.dirty && this.frmGrade.valid){            
        this.gradeService
          .editGrade(this.oldGrade,this.frmGrade.value,this.activatedRoute.snapshot.params['id'])
          .subscribe( 
            d => {
              if (d.error) this.core.notify(this.core.WARN_TITLE, d.message, 0);
              else {
                this.core.notify(this.core.SUCCESS_TITLE, this.core.SUCCESSFULLY_CHANGE, 1);
                this.frmGrade.reset();
                this.router.navigate(['/grade-listing']);
              }
          },
          error => this.core.notify(this.core.ERROR_TITLE, this.core.SOMETHING_WRONG, 0),
          );
        }else if(!this.frmGrade.dirty){
        this.router.navigate(['/grade-listing']);
    }
    }

}

[dividerColor]=“primary”
应该分配给
dividerColor
的是什么?错误消息非常清楚地说明了错误。应该为
dividerColor
分配什么
[dividerColor]=“primary”
?错误消息非常清楚地说明了错误。@GsMalhotra很高兴帮助您,谢谢:)@GsMalhotra很高兴帮助您,谢谢:)