Tom*_*tam 16 javascript dom typescript skrollr angular
我想将Skrollr实现为Angular2属性指令.
因此,格式可能是:
<body my-skrollr>
</body>
Run Code Online (Sandbox Code Playgroud)
但是,为了实现这一点,我需要能够检测包含标记(在本例中为<body>)下面的子元素中DOM的更改,以便我可以调用skrollr.init().refresh() ; 并更新库以使用新内容.
是否有一种直截了当的做法,我不知道,或者我是否接近这个错误?
Gün*_*uer 25
Angular没有为此目的提供内置的东西.您可以使用MutationObserver来检测DOM更改.
@Directive({
selector: '[my-skrollr]',
...
})
class MyComponent {
constructor(private elRef:ElementRef) {}
ngAfterViewInit() {
this.observer = new MutationObserver(mutations => {
mutations.forEach(function(mutation) {
console.log(mutation.type);
});
});
var config = { attributes: true, childList: true, characterData: true };
this.observer.observe(this.elRef.nativeElement, config);
}
}
Run Code Online (Sandbox Code Playgroud)