错误TypeError:无法读取未定义的属性'mat'

时间:2019-07-02 09:18:37

标签: angular angular6 typeerror

我是Angular 6的新手 我没有找到有关此问题的任何解释 我希望能够在模板中添加带有表单的实体,但是出现未定义属性的错误。 我使用了具有相同细节的相同服务,并且可以正常工作,但是在这里我无法 这是我的代码.ts和.html和模型

   export class OrderMissionComponent implements OnInit {
     ordermission : Ordermission = new Ordermission();
  submitted = false;
   etats :String[];
  localisation = Localisation;
     keys = [];
    etat = Etat;
    etatkeys = [];
    countries = ['beja', 'tunis', 'douz'];

       constructor(private omService: OrderMissionService,private 
     _router:Router,private fb: FormBuilder) 
     {

        this.keys=Object.keys(this.localisation);
       this.etatkeys=Object.keys(this.etat);

      }

             ngOnInit() {
               this.ordermission=this.omService.getter();


              }
       public dataForm = new FormGroup({
        myDateRange: new FormControl(null, Validators.required)
           });
         processForm(){
     if(this.ordermission.id==undefined){
       this.omService.SaveOM(this.ordermission).subscribe((ordermission)=> 
     {
     console.log(ordermission);
     this._router.navigate(['/ordermiss']);
   },(error)=>{
     console.log(error);
   });
       }else{
       this.omService.updateOM(this.ordermission,
    { 
      mat: this.ordermission.mat, 
      depart: this.ordermission.depart,
      dest :this.ordermission.dest,
      datedeb :this.ordermission.datedeb,
      datefin : this.ordermission.datefin,
      distance : this.ordermission.distance,
      etat : this.ordermission.etat,
      couttranp : this.ordermission.couttranp,
      coutheberg : this.ordermission.coutheberg,
      total: this.ordermission.total


         })
         .subscribe(
      data => {
        console.log(data);
        this._router.navigate(['/ordermiss']);
        this.ordermission = data as Ordermission;
      },

      error => console.log(error));

       }
        }
           new(): void {
          this.submitted = false;
        this.ordermission = new Ordermission();
                  }

.html

    <h3>Ordre de mission</h3>
      <div [hidden]="submitted" style="width: 300px;">
        <form  (ngSubmit)="processForm()">

              <div class="form-group"  >
            <label for="mat">Matricule</label>
            <input type="text" class="form-control" id="mat" required 
            [(ngModel)]="ordermission.mat" name="mat">


                 </div>

          <div class="form-group">
             <label for="depart">Depart</label>
            <div  class="form-group">
          <select class="form-control" formControlName="localisation">
          <option *ngFor="let key of keys ; index as i" value="i+1" 
           [label]="localisation[key]"></option>
            </select>
           </div>
          </div>

           <div class="form-group">
             <label for="dest">Destination</label>
              <div class="form-group">
          <select class="form-control" formControlName="localisation">
          <option *ngFor="let key of keys ; index as i" value="i+1" 
          [label]="localisation[key]"></option>
           </select>
             </div>
            </div>
          <div class="form-group">
             <label for="datedeb">Date debut</label>
          <input type="date" class="form-control" id="datedeb" required 
        [(ngModel)]="ordermission.datedeb" name="datedeb">
                </div>

         <div class="form-group">
           <label for="datefin">Date fin</label>
        <input type="date" class="form-control" id="datefin" required 
          [(ngModel)]="ordermission.datefin" name="datefin">
          </div>


           <div class="form-group">
         <label for="etat">Etat</label>
           <div  class="form-group">
         <select class="form-control" formControlName="etat">
           <option *ngFor="let key of etatkeys ; index as i" value="i+1" 
        [label]="etat[key]"></option>
         </select>
         </div>
       </div>
         <button type="submit" class="btn btn-success" >Submit</button>
        </form>
     </div>

模型

     export class Ordermission {
         id:number;
       mat:string;
      depart:String;
          dest:String;
       etat:String;
       datedeb:Date;
       datefin:Date;
      distance:number;
       couttranp:number;
       coutheberg:number;
         total:number;
     }

0 个答案:

没有答案