属性 'X' 是私有的，只能在 class 'xyzComponent' 内访问

Question

我正在尝试为 production 构建 angular2 应用程序，因为我正在关注此 blog。在我的 ngc 成功编译后，当 tsc 编译 发生时，它会生成如下图所示的错误：

搜索了一段时间后，我发现这个 blog 解释了 "The context property" 部分中的问题，我可能无法正确理解它给你一些好主意，告诉你发生了什么事。基本上，当我们将变量设为私有时，我们会得到 "ERROR: Property is private and only accessible within class"。我不明白为什么会这样。

请帮助我们，因为我们在过去几天一直在努力解决这个问题。

Answer 1

对于给定的组件，其模板访问的所有成员（方法、属性）在 AOT 编译场景中必须是 public。这是因为模板变成了 TS class。生成的 class 和组件现在是 2 个独立的 classes，您无法跨 class.

访问私有成员

简而言之：如果您想使用提前编译，则不能访问模板中的私有成员。

为了更好的解释https://github.com/angular/angular/issues/11422

Answer 2

所以我解决了这个问题我会保持简短。为了解决这个问题，我深入阅读了 blog。如在“上下文属性”部分中，此问题的解决方案是如果要在其中使用私有变量，则不要使用或创建私有变量当您使用 AOT（即提前）为生产创建构建时直接查看。

*例如*

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

输出： 属性 '_initials' 是私有的，只能在 class 'ThirdPartyComponent'.

内访问

解法：

将此 private _initials: string; 更新为 _initials: string;

对于这个答案Harish Gadiya请给我一些帮助，谢谢。

Answer 3

也许另一个更简单的答案是：

Guys, please don't call private methods, fields or properties from the HTML :)

P.S。将 *.ts 代码编译为 *.js 时，AOT 拒绝将非 public 成员与 HTML 模板连接.

And "yes" this will make your build pipeline to fail :D

Answer 4

我在构造函数中声明私有注入时得到了这个：

constructor(private service: SpecificObjectService) { }

并在模板中使用它们：

*ngFor="let pd of service.listSpecificObject "

解决方法是：

constructor(public service: SpecificObjectService) { }

Answer 5

这对我有用：只需将服务更改为 public。

constructor(public service: SpecificObjectService) { }

应用正在生产中！！

Answer 6

好的，看到这真的是一个简单的 javascript es6 问题，如果你必须保持数据类型私有，你可以简单地这样做

privateAccess(){
     return this.cannotAccessByInstanceButStillNeeded
}

Answer 7

如果要在视图中使用路由器，请设置public。

例如：

<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 给我发了一封警告邮件。

Answer 8

您始终可以在导致此错误的行前添加 // @ts-ignore。检查 Doc

Answer 9

只需去掉变量前面的'private'访问修饰符即可。如果它是在构造函数中声明的实例，则只需将 'private' 更改为 'public'.

属性 'X' 是私有的，只能在 class 'xyzComponent' 内访问

Property 'X' is private and only accessible within class 'xyzComponent'

typescript

typescript-typings

angular2-aot

angular