Question

我想在component1中的元素上单击时调用component2中的变量。

component1.html <p (click)="loadThisDiagram()">Load</p>

component1.ts

@Output() update = new EventEmitter<any>();
loadThisDiagram() {
            this.update.emit({
                url: 'new_diagram'
            });
        }

component2.ts

loadingDiagram() { const url = event.url; }

我做错了什么？

Answer 1

在您的第二个组件中，您正在发出事件，但在您的父组件中，您需要捕获该事件。同样在您的父组件中，您正在发出单击但捕获为未匹配的更新。

@Output() click = new EventEmitter<any>();

loadThisDiagram() {
            this.update.emit({
                url: 'new_diagram'
            });
        }

在这里，您要发出需要在其他组件中捕获的事件

通过调用函数

来捕获事件

management(event) {
   this.url = event.url;
}

例如

正常事件发出示例。这里myChange是一个事件，并且在事件发生变化时它调用myCahngeFun

<div class="col-3">
  <cfs-change (myChange)="myChangeFun($event)"></cfs-change>
</div>

这里myChange是一个事件绑定，它将在同一个组件中调用myChangeFun。因此，每当有任何事件更改为myChange时，它都会通知

  public myChangeFun(event) {
    this.newSearch = event.newSearch;
    ...
  }

在cfs-change组件中，您需要通知父组件myChange正在更改，因此将该事件应用于myChangeFun。

  public someotanyfuncton() {
    ...
    this.myChange.emit({newSearch: this.viewFacets});
  }

因此，上述调用将通知父组件子组件已更改并已发出。

希望有所帮助

在不同组件中单击更改变量

1 个答案:

例如