我有一个复杂的形式,我已经简化了这个问题的目的和托管的plunk。
对于“编辑” openEditor(i: number, isEditor: boolean)
三个的onclick功能,“添加”和“保存更改” moveToItem()
都使用window.location.hash导航到该否则隐藏不活动时的编辑。
它的工作原理是预期,但无法在Chrome。我收集它与Chrome浏览器做做一个页面刷新,因为它认为哈希变化生成一个新的URL
题:
有人可以提供一个相对简单的修复,将镀铬(以及example)工作?
如果做不到这一点的是管理表单中编辑的最佳方法?
我想到的是有很多的FormComponent回事),但不能编辑器创建一个单独的子组件确定,这将有助于解决这个问题,因为我还需要导航到该点的页面,它位于然后回相应的数据。
编辑需要的形式和访问中存在/更新表单数据。
有些事情我已经尝试:
哈希设置为空或空之前:
window.location.hash = null;
window.location.hash = '';
前面加上#上的值
window.location.hash = '#form-editor';
也:
(<HTMLScriptElement>document.querySelector('#' + 'form-editor')).scrollIntoView();
与pushState的我可以改变的URL,但它不会移动到锚点:
window.history.pushState(null, null, '#form-editor');
window.history.replaceState(null, null, '#form-editor');
附加信息:
“添加”功能是在列表中添加一个新的项目选定项目后,
锚点表单编辑器:
<div id="form-editor">
并为每个项目编号创建一个动态ID:
<div id="item{{i}}">Item: {{i}}</div>
谢谢!
在Chrome刷新错误(从Safari浏览器得到的),我看了,只有一个锚点击 - 与href
指向我们想要的哈希地方 - 会工作。所以,我们必须代码的东西,会做,就像这样开始body
:
<body unbeforeunload="whereWeWantToScroll.click()"> <a id="whereWeWantToScroll" href="#form-editor" style="display: none"> Reposition to the right place </a>
在这个例子中,锚是隐藏的,而是应该position: fixed
如果只是有触发它的unbeforeunload
。