angular - Angular：仅允许通过模板访问组件成员

Question

这一直困扰着我很长时间，我找不到令人满意的答案。

假设我们有以下组件：

@Component({
  selector: 'app-foo',
  templateUrl: './foo.component.html',
  styleUrls: ['./foo.component.scss']
})
export class FooComponent {

  constructor() {
  }

  respondToEventFromTemplate() {
    // do something...
  }
}

因为模板不是组件的成员，respondToEventFromTemplate必须公开，代码才能通过 AOT。

但是，假设我们有以下内容：

@Component({
  selector: 'app-bar',
  template: '<app-foo #foo></app-foo>',
  styleUrls: ['./bar.component.scss']
})
export class FooComponent implements AfterViewInit{
  
  @ViewChild('foo') fooComponent: FooComponent;

  constructor() {
  }

  ngAfterViewInit() {
    this.fooComponent.respondToEventFromTemplate();
  }


}

此代码完全有效，但会破坏封装。响应组件Foo模板中的事件的方法不应被组件Bar访问，因此应设为private。

所以我的问题是：有什么解决方案或解决方法可以让我使组件成员只能在其模板中访问而在其他任何地方都无法访问？

标签： angular