Events 每次组件变为可见时的事件

在Angular2中，当我的组件变得可见时，是否有方法触发事件？

---

它被放置在tabcontrol中，我希望在用户切换时收到通知。我希望我的组件触发一个事件。

您可以使用

ngAfterViewInit（）

回调

更新

新的交叉口观察者API可用于此目的

---

另请参见

没有此类事件，但如果您使用的是选项卡控件，正确的方法是为您的选项卡控件创建选项卡更改

@Output

，如果它是自定义的，否则，大多数选项卡控件（如）也有一些选项卡更改事件

如果组件必须知道这一点，则可以使用此选项卡更改事件来检测哪个选项卡可见，如果知道哪个选项卡可见，还可以知道组件是否可见。所以你可以这样做：

onTabChange(event) {
    this.currentTab = /** Get current tab */;
}

@Injectable()
export class TabService {
  observable: Observable<any>;
  observer;

  constructor() {
    this.observable = Observable.create(function(observer) {
      this.observer = observer;
    });
  }
}

然后，如果有输入，可以将其发送到组件本身：

@Input() activated: boolean = false;

然后您可以将其应用于：

<my-component [activated]="currentTab == 'tabWithComponent'"></my-component>

当组件希望侦听这些更改时，它可以订阅

tabService.observable

。当您的选项卡发生更改时，您可以使用

tabService.observer.next（）

将新项目推送到该选项卡上。我最后做的是（虽然不是很漂亮，但在我没有更好的方法进行操作的情况下工作…）使用

ngAfterContentChecked（）

回调并自己处理更改

@ViewChild('map') m;
private isVisible: boolean = false;
ngAfterContentChecked(): void
{
    if (this.isVisible == false && this.m.nativeElement.offsetParent != null)
    {
        console.log('isVisible switched from false to true');
        this.isVisible = true;
        this.Refresh();
    }
    else if (this.isVisible == true && this.m.nativeElement.offsetParent == null)
    {
        console.log('isVisible switched from true to false');
        this.isVisible = false;
    }
}

---

对于那些在家观看的人，您现在可以使用

ngAfterContentInit（）

进行此操作，至少在Ionic上是这样。

---

我有同样的目的，无法找到令人满意的方法。第一个答案会打很多次电话。 当然，我用了一种折衷的方式，也不优雅。 在父组件中，我设置了一个方法：

parentClick() {
  setTimeout(() => {
    // TO-DO 
    This.commonService.childMethod();
  }, time);
}

---

也许这个方法在时间上不准确，但在某种程度上，你达到了目的。

它似乎不符合我的需要，我在这个回调中放置了一个日志，它只被调用了一次（不管我的组件是否可见）。Angular无法知道如果一个组件隐藏在另一个DOM元素后面，它何时会变得可见。。如果使用

*ngIf=”“

显示/隐藏，则在选择或取消选择选项卡时，会调用组件，然后每次调用

ngAfterViewInit（）

。ngAfterViewInit是在初始化视图后调用的，而不是在查看元素后。如果这是您实现的选项卡控件，当然，您可以添加一个事件发射器并在更改tab的同一位置发射？我使用primeng的tab控件，并且唯一存在的事件是在更改之前调用的，因此该控件此时还不可见：（这是一个很好的想法，但是我不认为它在我的例子中起作用，因为我使用的TabMeCube是从PrimEN中得到的，它们只在标签发生了变化之前提供了一个Tabor更改事件。在这个时候，我的组件是不可见的……M.NATEVELATIONE？@ DGAY和NATEVELATION指向本地DOM HTML元素。ngAfterContentChecked在父或子trhee组件中的任何类型的事件中都被执行。它可能被调用100次，您实际上只需要执行这100次中的1次