Question

我来自React背景（就我的前端技能而言），并且需要使用Angular 7做一些工作。

我想在类中更改一个声明组件（mycomponent.component.ts）的变量，然后在浏览器中查看给定新值的结果（该值控制着可见的元素）。 / p>

在React中，您可以通过（以不可变的方式）更改this.state变量来做到这一点。我正在尝试使用@Output指令来做到这一点：

@Output() private hasResults: boolean = false;
//...

@Output()
buttonClick() {
    const result: Observable<Object> = this.myservice.queryData();
    result.subscribe(item => {

      if (item !== undefined) {
        this.hasResults = true;
      } else {
        this.hasResults = true;
      }
      console.log('item is ', item)
    })

  }

该服务正在执行简单的GET请求。

相应html文件中的某些元素取决于要打印的hasResults的值，并且它们对更改没有反应。

我在做什么错了？

Answer 1

这与范围有关，hasResults被标记为私有，这意味着组件的模板无法访问它。删除private访问修饰符，您也不需要@Output，因为它用于向订阅者广播事件。

hasResults: boolean = false;
//...

buttonClick() {
  const result: Observable<Object> = this.myservice.queryData();
  result.subscribe(item => {
    this.hasResults = item !== undefined;
    console.log('item is ', item)
  })
}

如何使用Angular 7在状态更改时强制重新加载组件

1 个答案: