Question

我是不熟悉角度和前端编程的，所以很抱歉。

我有一个HTML文件，看起来像这样

<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>

在我的.ts组件文件中

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

  private inputClick: boolean = false;
}

在HTML文件中看不到inputClick变量

Answer 1

如果您将其声明为私有，则不会发生数据绑定。您需要将其声明为public才能使其可用。请遵循以下代码：

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

      public inputClick: boolean = false;
    }

然后您可以像这样在HTML中使用它。

<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>

Answer 2

将“私人”更改为“公共”或删除访问修饰符（默认情况下为公共）

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

 inputClick: boolean = false;
}

Answer 3

您可以执行上述任一操作，因为在将inputClick声明为私有后无法访问

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

 inputClick: boolean = false;
}

或

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

 public inputClick: boolean = false;
}

声明了Angular 5'inputClick'，但从未读取其值

3 个答案: