如何解决角度为1.5的站点导航栏的粘性基础

Question

我试图让this example适应我的角度项目。这是我自己改编的Plunkr link，以及重要的代码本身：

我不知道我错过了什么或输错了...任何帮助都会受到赞赏，因为我已经有一周时间我正面临这个问题并且无法解决这个问题。

<div id="page">
  <header id="landing" class="header">
    <div class="medium-4 small-centered text-center columns">
      <h4 class="text-center">Expand your dimensions</h4>
      <a class="">Scroll to content</a>
    </div>
  </header>
  <div data-sticky-container id="navigation">
    <div data-sticky data-margin-top='0' data-top-anchor="landing:bottom" data-btm-anchor="page:bottom">
      <div class="top-bar">
        <div class="top-bar-left">
          <a href="#">
            <img src="http://placehold.it/150x38" alt="" />
          </a>
        </div>
        <div class="top-bar-right">
          <ul class="menu">
            <li><a href="#about">About me</a></li>
            <li><a href="#portfolios">Portfolio</a></li>
            <li><a href="#contact">Get in touch</a></li>
          </ul>
        </div>
      </div>
    </div>
  </div>
  <br />
</div>

提前致谢。