typescript - IntelliJ, Angular uygulamasında yöntemi statik yapmayı yanlış şekilde öneriyor

Sadece bir formu boşluğa göndermekten başka hiçbir şey yapmayan basit bir kayıt bileşenim var. Ancak, IntelliJ onSubmit'in static olabileceğini öneriyor. Eğer imzayı static olarak değiştirirsem, o metodu çağıramıyorum - en azından benim anladığım kadarıyla - tüm cevaplar, bir şablon içerisinden statik bir bileşen metodunun çağrılamayacağını söylüyor.

Görünüşe göre IntelliJ, aslında bu yöntemi şablonda çağırdığımı fark etmiyor ve bu yüzden yöntemi static yapmamı yanlış bir şekilde öneriyor.

Bir çözüm yolu var mı yoksa bu uyarıyla mı yaşamam gerekecek?

İşte bir örnek:

Bileşen :

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() {
  }

}

Şablon :

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

Cevap #1

Intellij bu tür yöntemleri statik yapmayı önerir çünkü bunlar bir örneğin herhangi bir durumuna dokunmaz.

onSubmit yöntemini statik yapabilirsiniz:

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

ve sonra intellij, bu yöntemi sınıfınızdaki statik olmayan yöntemlerden önce yerleştirmeniz konusunda sizi uyaracak.

O zaman, şablondan statik üyelere çağrı yapmak için bileşende bir getter sağlamanız gerekir, tıpkı yaptığınız gibi.

onSubmit = RegisterComponent.onSubmit;

Yani, senin kodun şöyle olmalı:

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() {
  }
}

Bu işe yarayacak ve hiçbir uyarınız olmayacak.

Cevap #2

Bu uyarıyı bastırmanın en hızlı yolu, uyarı üzerinde alt-enter kısayolunu kullanmak ya da imleç uyarıya neden olan kodda iken ampul simgesine tıklamak ve ardından uyarıyı bastırma seçeneklerini içeren ilgili açılır menüyü tetiklemek için sağ ok tuşunu kullanmaktır.

İlgili makaleler