基础6在Angular2中的粘性元素
这个问题构建了我之前的一个问题： ngOnDestroy和$（’＃element’）。foundation（’destroy’）; 我基本上试图在我的Angular2应用程序中使Foundations Sticky工作。 除了我无法破坏Foundation元素的问题，使用ngOnDestroy() ，我总是在使用Sticky元素。 我有的是这个：
组件模板
可能很重要的是说wrapperDiv是直接加载的，并且在它的父ngIf中没有ngIf条件。
在我的组件中，我在ngAfterViewInit使用它：
零件
ngAfterViewInit(): void { $('#myStickyElement').foundation(); }
当我在这个特定视图上重新加载整页时 ，一切都超级有效！ 如果我导航到此视图，则它不起作用。 似乎与整页重新加载有关
在某些方面，我正在创建像这样的Sticky元素：
let myStickyElement = new Foundation.Sticky($('#myStickyElement'));
这对行为没有任何影响，但我可以打印出对象myStickyElement 。
在整页重新加载时，对象如下所示： 
在这里，如果我导航到页面：
如您所见， myStickyElement的对象看起来有所不同。 缺了点什么。 有没有人遇到过这个问题？ 为什么整页重新加载如此不同？
使用这个：
ngAfterViewInit(): void { $('#myStickyElement').foundation(); }
是正确的举动，但由于某种原因粘性插件不起作用。 该插件附加了一个数据对象zfPlugin ，它具有api以启用“粘性”
这是你如何做到的：
ngAfterViewInit(): void { $('#myStickyElement').foundation(); $('#myStickyElement').data("zfPlugin")._setSticky(); }
我在这里设置了一个plnkr，显示了这个工作： https ：//plnkr.co/edit/zPuXooHYsJHuOQUj6Rdd？p = preview
更新1
在这里查看基础代码后： https ： //github.com/zurb/foundation-sites/blob/develop/js/foundation.sticky.js具体来说这个块：
$(window).one('load.zf.sticky', function(){ ... }
粘性插件正在等待事件load.zf.sticky被触发，它发生在静态页面中，因为基础知道这些元素在页面上。 由于它是角度组件，您必须自己触发该事件。
我在这里更新了plunkr： https ：//plnkr.co/edit/1P6oU5ZrdKHGlMeHYUUw ？ p = preview
这是我做的更新：
ngAfterViewInit(): void { $('#myStickyElement').foundation(); $(window).trigger('load.zf.sticky'); }
注意 ：在html中我添加了data-sticky-on="small"