angular - IntelliJ 错误地建议在 Angular 应用程序中将方法设为静态

Question

我有一个简单的注册组件，它只是将表单提交到 nirvana。但是，IntelliJ 建议 onSubmit 可以是 static。如果我将签名更改为 static 我无法调用该方法 - 至少据我所知 - 所有答案都表明不能从模板中调用静态组件方法。

显然 IntelliJ 没有意识到，我实际上是在模板中调用此方法，因此错误地建议将方法设置为 static。

是否有解决方法，或者我是否只能接受该警告？

这是一个例子:

组件:

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-register',
  templateUrl: './register.component.html',
  styleUrls: ['./register.component.css']
})
export class RegisterComponent implements OnInit {
  data: any;
  constructor() {
    this.data = {
      username: ''
    };
  }

  // WARNING: Method can be static
  onSubmit(event) {
    alert('Submitting ..');
  }

  ngOnInit() {
  }

}

模板:

<form (ngSubmit)="onSubmit($event)">    
  <mat-grid-list cols=1>

    <mat-form-field>
      <input matInput placeholder="Username" [(ngModel)]="data.username" name="uname">
    </mat-form-field>    
    <mat-grid-list cols=2>
      <button mat-button type="submit">Ok</button>
      <button mat-button>Cancel</button>
    </mat-grid-list>

  </mat-grid-list>    
</form>

Answer 1

Intellij 建议将这种方法设为静态，因为它们不会触及实例的任何状态。

您可以将 onSubmit 方法设为静态:

static onSubmit(event) {
    alert('Submitting ..');
}

然后 intellij 将警告您将此方法放在类的非静态方法之前。

然后，您需要在组件中提供一个 getter，以便像您一样从模板中调用静态成员。

onSubmit = RegisterComponent.onSubmit;

所以，你的代码应该是:

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-register',
  templateUrl: './register.component.html',
  styleUrls: ['./register.component.css']
})
export class RegisterComponent implements OnInit {
  data: any;

  onSubmit = RegisterComponent.onSubmit;

  static onSubmit(event) {
    alert('Submitting ..');
  }

  constructor() {
    this.data = {
      username: ''
    };
  }

  ngOnInit() {
  }
}

这会起作用，您不会收到任何警告。