creditcard: year model binding issue resloved

Author: medha410

src/models/creditcardmodel.component.ts

@@ -9,6 +9,5 @@ export class AmexioCreditCardModel {
       this.cvv = null;
       this.cardnumber = null;
       this.expMonth = 1;
-      this.expYear = 2018;
-    }
+      this.expYear  = new Date().getFullYear();    }
   }

src/module/forms/creditcard/creditcard.component.html

@@ -28,7 +28,7 @@
                     </select>
                 </div>
                 <div class="dateSglCol">
-                    <select [(ngModel)]="creditCardModel.expYear" yearControl="yearControl" style="padding:10px" placeholder="YY">
+                    <select [(ngModel)]="creditCardModel.expYear"   (ngModelChange)="onChangeYear($event)"   yearControl="yearControl" style="padding:10px" placeholder="YY">
                         <option *ngFor="let year of yearList">{{year}}</option>
                     </select>
                 </div>
@@ -68,7 +68,7 @@
                         </select>
                     </div>
                     <div class="date">
-                        <select [(ngModel)]="creditCardModel.expYear" yearControl="yearControl" style="padding:10px" placeholder="YY">
+                        <select [(ngModel)]="creditCardModel.expYear" (ngModelChange)="onChangeYear($event)" yearControl="yearControl" style="padding:10px" placeholder="YY">
                             <option *ngFor="let year of yearList">{{year}}</option>
                         </select>
                     </div>

src/module/forms/creditcard/creditcard.component.ts

@@ -101,6 +101,7 @@ export class AmexioCreditcardComponent implements ControlValueAccessor, OnInit {
       this.creditCardModel = modelValue;
       this.onChangeCardNumber(this.creditCardModel.cardnumber);
       this.onChangeMonth('0' + this.creditCardModel.expMonth);
+      this.onChangeYear(this.creditCardModel.expYear);
       this.isCvvValid = this.cvvRegex.test(this.creditCardModel.cvv);
       this.cardRegexMap.forEach((value: any, key: string) => {
         const isEagarValid = value.test(this.dummyCreditCardNumber);
@@ -201,6 +202,7 @@ export class AmexioCreditcardComponent implements ControlValueAccessor, OnInit {
   }
   // Map Implementation for key value pair
   ngOnInit() {
+    this.creditCardModel = new AmexioCreditCardModel();
     this.cardRegexMap = new Map();
     this.cardPatternMap = new Map();
     this.cardRegexMap.set('eagerflagvisa', this.visaEagerReg);
@@ -336,4 +338,7 @@ export class AmexioCreditcardComponent implements ControlValueAccessor, OnInit {
     this.dummyMonth = event;
     this.creditCardModel.expMonth = +this.dummyMonth;
   }
+  onChangeYear(event: any) {
+    this.creditCardModel.expYear = event;
+  }
 }