CODEWITHSUNDEEP
angularangular5
Milan Panic
Milan Panic

Reputation: 503

Angular 5 'inputClick' is declared but its value is never read

I'm new to angular and front end programming so I'm sorry if that is too easy.

I have an HTML file that looks like this

<input class="born-date-input" formControlName="dateOfBorn" minlength="1" maxlength="10" (click)="inputClick=true"/>
<div class="alert alert-warning" *ngIf="inputClick==true">
      <small>show warning</small>
</div>

In my component .ts file I have 

export class MainInputFormComponent implements OnInit, DoCheck {
  @Output('changeData') sendTheNewDataJSON = new EventEmitter<any>();

  private inputClick: boolean = false;
}

the inputClick variable is not seen in the HTML file

Upvotes: 3

Views: 1821

Answers (3)

Tayormi
Tayormi

Reputation: 1405

You can do either of these because inputClick cannot be accessed when it is declared private

 export class MainInputFormComponent implements OnInit, DoCheck {
 @Output('changeData') sendTheNewDataJSON = new EventEmitter<any>();

 inputClick: boolean = false;
}

or 

export class MainInputFormComponent implements OnInit, DoCheck {
 @Output('changeData') sendTheNewDataJSON = new EventEmitter<any>();

 public inputClick: boolean = false;
}

Upvotes: 1

Trần Quang Ti&#234;n
Trần Quang Ti&#234;n

Reputation: 31

Change 'private' to 'public' or remove access modifier (by default it is public)

export class MainInputFormComponent implements OnInit, DoCheck {
 @Output('changeData') sendTheNewDataJSON = new EventEmitter<any>();

 inputClick: boolean = false;
}

Upvotes: 2

Ankit Kumar Singh
Ankit Kumar Singh

Reputation: 557

Data binding will not happen if you declare it as private. You need to declare it as public to make it available. Follow the code below:

   export class MainInputFormComponent implements OnInit, DoCheck {
      @Output('changeData') sendTheNewDataJSON = new EventEmitter<any>();

      public inputClick: boolean = false;
    }

then you can use it in your HTML like this.

<input class="born-date-input" formControlName="dateOfBorn" minlength="1" maxlength="10" (click)="inputClick=true"/>
<div class="alert alert-warning" *ngIf="inputClick">
      <small>show warning</small>
</div>

Upvotes: 4

Related Questions