Properti 'X' bersifat pribadi dan hanya dapat diakses dalam kelas 'xyzComponent'


101

Saya mencoba membangun aplikasi angular2 untuk produksi yang saya ikuti blog ini . Setelah kompilasi ngc saya berhasil ketika kompilasi tsc berlangsung, itu menghasilkan kesalahan di bawah ini yang ditunjukkan pada gambar:

masukkan deskripsi gambar di sini

Setelah mencari beberapa saat saya menemukan blog ini yang menjelaskan masalah di bagian "Properti konteks" yang tidak dapat saya pahami dengan benar mungkin itu memberi beberapa ide bagus kepada Anda bahwa apa yang terjadi salah. pada dasarnya ketika kita membuat variabel pribadi kita mendapatkan "ERROR: Properti bersifat pribadi dan hanya dapat diakses di dalam kelas" . Saya tidak mengerti mengapa itu datang.

Mohon bantu kami saat kami membenturkan kepala kami dalam masalah ini selama beberapa hari terakhir.


1
Sudahkah Anda mencoba mengubah properti dari pribadi menjadi publik?
Xin Meng

bisakah Anda berbagi konten file ts yang memberikan kesalahan?
Raj

Jawaban:


143

Untuk komponen tertentu, semua anggotanya (metode, properti) yang diakses oleh template-nya harus publik dalam skenario kompilasi AOT. Hal ini disebabkan oleh fakta bahwa template diubah menjadi kelas TS. Kelas yang dibuat dan komponen adalah 2 kelas terpisah sekarang dan Anda tidak dapat mengakses anggota pribadi lintas kelas.

Singkatnya: Anda tidak dapat mengakses anggota pribadi di templat Anda jika Anda ingin menggunakan kompilasi sebelumnya.

Untuk penjelasan yang lebih baik https://github.com/angular/angular/issues/11422


tapi ini bukan kasus versi Angular sebelumnya, bukan? Saya mulai mendapatkan kesalahan tersebut setelah meningkatkan ke versi terbaru.
Emil

36

Mungkin jawaban lain yang lebih sederhana adalah:

Teman-teman, tolong jangan panggil metode, bidang, atau properti pribadi dari HTML :)


PS saat menyusun *.tskode *.js, AOT menolak untuk menghubungkan anggota non-publik dengan templat HTML .

Dan "ya" ini akan membuat pipeline build Anda gagal: D


1
Atau akses bidang / properti pribadi!
JMK

@Arsen Khachaturyan It`s funny)
voodoo417

@JMK Saya sudah perbarui posting sesuai saran Anda, terima kasih.
Arsen Khachaturyan

@ voodoo417, lucu dan benar;). Terkadang jawaban yang terlalu akademis benar-benar dapat membuat orang terpesona, dan kita hanya perlu sesederhana mungkin.
Arsen Khachaturyan

1
@Arsen Khachaturyan Setuju, Arsen +++
voodoo417

17

Saya mendapatkan ini ketika saya mendeklarasikan injeksi pribadi di konstruktor:

constructor(private service: SpecificObjectService) { }

Dan menggunakannya di template:

*ngFor="let pd of service.listSpecificObject "

Solusinya adalah:

constructor(public service: SpecificObjectService) { }

16

Jadi saya memperbaiki masalah ini, saya akan membuat ini singkat dan sederhana. Untuk mengatasinya saya membaca blog ini secara mendalam. Seperti di bagian " Properti konteks " Solusi untuk masalah ini adalah Jangan gunakan atau buat variabel pribadi jika Anda ingin menggunakannya dalam tampilan secara langsung saat Anda membuat bangunan dengan AOT ( yaitu, Ahead Of Time ) untuk produksi.

*sebagai contoh *

// component.ts
@Component({
  selector: 'third-party',
  template: `
    {{ _initials }}
  `
})
class ThirdPartyComponent {
  private _initials: string;
  private _name: string;

  @Input()
  set name(name: string) {
    if (name) {
      this._initials = name.split(' ').map(n => n[0]).join('. ') + '.';
      this._name = name;
    }
  }
}

output: Properti '_initials' bersifat pribadi dan hanya dapat diakses dalam kelas 'ThirdPartyComponent'.

Larutan:

perbarui ini private _initials: string;menjadi sederhana_initials: string;

Untuk jawaban ini Harish Gadiya memberi saya bantuan jadi terima kasih untuk itu.


tidak perlu menggunakan di _namesana, bisa sama seperti yang Anda gunakan this.dan namevariabel lokal lainnyathis.name=name;
LazerBanana

@LazerBanana, Tapi this.name=namedi set nameinf. rekursi
vp_arth

@vp? satu lokal, satu global? Bahkan dengan nama yang sama 2 hal yang berbeda, kurasa? Itulah mengapa Anda biasa this.menunjuk ke yang global
LazerBanana

Apa yang Anda maksud dengan bahasa lokal / global? namebukan variabel, itu adalah properti objek. this.name = nameakan memicu setter ( set name(v){}) pada objek itu. Sangat mudah untuk mengujinya: blitz Maximum call stack size exceeded
vp_arth

6

Ini berfungsi untuk saya teman-teman: Cukup ubah layanan ke publik.

constructor(public service: SpecificObjectService) { }

Aplikasi bekerja dalam produksi !!


Jadi solusi yang sama persis dengan jawaban yang kurang detail seperti jawaban @ TiyebM di atas.
Ash

0

ok lihat ini benar-benar masalah javascript es6 sederhana, jika Anda harus menjaga tipe data pribadi Anda cukup melakukan ini

privateAccess(){
     return this.cannotAccessByInstanceButStillNeeded
}

0

Jika Anda ingin menggunakan router dalam tampilan, harap jadikan publik.

Misalnya:

<button 
   [routerLink]="['/login']"
   [queryParams]="{redirectTo: router.url}"
   translate="Please sign in to use this feature"
/>
import { Router } from '@angular/router'; 

constructor(
   public router: Router; // don't make it private
) {}

Saya mengabaikannya sampai Github CI mengirimi saya surat peringatan.

Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.