'X' özelliği özeldir ve yalnızca 'xyzComponent' sınıfından erişilebilir

Bu blogu takip ettiğim için üretim için angular2 uygulaması oluşturmaya çalışıyorum . Ngc başarılı derlememden sonra tsc derlemesi gerçekleştiğinde, görüntüde gösterilen aşağıdaki hatayı oluşturur:

Bir süre aradıktan sonra , tam olarak anlayamadığım "Bağlam özelliği" bölümünde sorunu açıklayan bu blogu buldum , neyin yanlış olduğu konusunda size iyi bir fikir verebilir. temelde bir değişkeni özel yaptığımızda "HATA: Mülk özeldir ve yalnızca sınıf içinde erişilebilir" mesajı alıyoruz . Neden geldiğini anlamıyorum.

Geçtiğimiz birkaç gündür bu soruna kafa yorarken bize yardım edin.

Belirli bir bileşen için, şablonu tarafından erişilen tüm üyeleri (yöntemler, özellikler) AOT derleme senaryosunda herkese açık olmalıdır. Bunun nedeni, şablonun TS sınıfına dönüştürülmesidir. Oluşturulan bir sınıf ve bir bileşen artık 2 ayrı sınıftır ve sınıflar arası özel üyelere erişemezsiniz.

Kısacası, önceden derlemeyi kullanmak istiyorsanız şablonlarınızdaki özel üyelere erişemezsiniz.

Daha iyi açıklama için https://github.com/angular/angular/issues/11422

Belki daha da basit bir cevap şudur:

Çocuklar, lütfen HTML'den özel yöntemleri, alanları veya özellikleri çağırmayın :)

PS, *.tskodu derlerken AOT*.js , genel olmayan üyeleri HTML şablonuna bağlamayı reddediyor .

Ve "evet" bu, derleme ardışık düzeninizin başarısız olmasına neden olur: D

Bunu yapıcıda özel enjektabl bildirdiğimde aldım:

constructor(private service: SpecificObjectService) { }

Ve bunları şablonda kullandı:

*ngFor="let pd of service.listSpecificObject "

Çözüm şudur:

constructor(public service: SpecificObjectService) { }

Bu yüzden bu sorunu çözdüm, bunu kısa ve basit tutacağım. Bunu düzeltmek için bu blogu derinlemesine okudum . " Bağlam özelliği " bölümünde olduğu gibi Bu sorunun çözümü şudur : Yapınızı AOT ile oluştururken doğrudan görünümde kullanmak istiyorsanız, bir özel değişken kullanmayın veya oluşturmayın ( yani, Ahead Of Time ) için üretim.

*Örneğin *

// 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;
    }
  }
}

çıktı: '_initials' özelliği özeldir ve yalnızca 'ThirdPartyComponent' sınıfından erişilebilir.

Çözüm:

private _initials: string;bunu basitçe güncelle_initials: string;

Bu cevap için Harish Gadiya bana bunun için çok yardım et.

Bu benim için çalışıyor çocuklar: Basitçe hizmeti halka açın.

constructor(public service: SpecificObjectService) { }

Uygulama üretimde çalışıyor !!

Tamam, bunun gerçekten basit bir javascript es6 problemi olduğunu görün, veri türünü gizli tutmanız gerekiyorsa, bunu kolayca yapabilirsiniz

privateAccess(){
     return this.cannotAccessByInstanceButStillNeeded
}

Yönlendiriciyi görünümde kullanmak istiyorsanız, lütfen onu genel yapın.

Örneğin:

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

Github CI bana bir uyarı mesajı gönderene kadar bunu görmezden geldim.