angularJS $ anchorScroll不工作,window.scrollTo(,0,0)或任何$(Window)变体都不工作

时间:2018-06-09 22:48:17

标签: jquery angularjs scroll angular-ui-router anchor-scroll

我遇到了一些我似乎无法弄清楚的事情。我有一个使用Angular JS和UI-Router和Angular Formly的SPA,其中我有以下情况

<!--Entry Point of UI-Router View-->
   <a href="#" id="back2Top"></a>
   <form>
      <formly-form ng-if="vm.model.page === 1">
          <button type="button" ng-click="showRec(); vm.model.page = 2">Receivables</button>
       </formly-form>
      <formly-form ng-if="vm.model.page === 2"></formly-form>
      <formly-form ng-if="vm.model.page === 3"></formly-form>
      <formly-form ng-if="vm.model.page === 4"></formly-form>
      <formly-form ng-if="vm.model.page === 5" ></formly-form>
   </form>

在表单上,​​我有按钮隐藏/显示不同形式的表单,具体取决于您按下的按钮。因此,例如,当我单击应收款管理系统按钮时,它将页面设置为2,然后调用执行许多其他操作的showRec函数。它也隐藏了第一种形式。一旦第一个表单不再在DOM上呈现,第二个formn就成为页面上的第一个表单。但它仍然属于另一种形式的页面部分。

我在$ anchorScroll文档中声明$location.hash('back2Top'),然后调用$anchorScroll()。除了它什么也没做。

我尝试将它包装在$ timeout中,以为它在DOM正在改变时尝试执行,虽然我不明白为什么会有所不同,因为锚链接在页面顶部无论如何都在它们之上

我尝试使用window.scrollTo(0,0)但没有任何反应。 我尝试使用parent.window.scrollTo(0,0)没有任何反应。

我尝试使用jQuery变体$(window).scrollTo('#back2Top')但没有任何反应。

基本上,当我通过按下按钮更改表单时,我无法将其转到页面顶部。这些表单都在同一个HTML页面上并由同一个控制器控制,它们基本上位于不同的“部分”中,因为这样可以更容易地处理它们,因为它们是具有许多选项的大型表单。

我怎样才能让它工作?令我疯狂的是,我不能做一些简单的事情,比如让页面在切换表单时一直滚动到顶部而不是它们被卡在表单的正常位置,表单将被呈现,即使其余的由于我使用ng-if ...

,DOM不再存在

非常感谢任何帮助。

0 个答案:

没有答案