问题标签 [durandal-navigation]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
123 浏览

durandal - Durandal 路由器缓存视图不起作用(v2.1.0)

我试图弄清楚如何使用 Durandal v2.1.0 路由器在使用router.navigate() 的视图之间导航;功能。我已经能够在两个视图之间来回导航,但是每​​次重新创建视图时。我希望能够缓存这些视图,因此如果路由器路由到已经激活的视图,一旦它会简单地从缓存中获取现有视图(以及它的当前视图模型状态,例如可观察值等......) .

我虽然可以在 shell 中的路由器绑定中使用cacheViews: true选项,但这似乎不起作用。任何帮助将不胜感激。

0 投票
1 回答
184 浏览

durandal - 未找到 Splat 路线 (DurandalJS)

settings在 shell.js 中配置了 splat 路由:

views/settings/main.js文件中我创建了子路由器:

文件夹结构如下所示:

我面临的问题是:

当我尝试从另一个父路由页面导航到设置(#settings)页面时,它会在控制台中显示一条错误消息:

Route Not Found settings undefined

但是设置页面仍然显示我创建的所有子路由器列表。

接下来,我尝试导航到#settings/usersand#settings/users/{id}并且它可以正常工作,即使从另一个父页面尝试它也是如此。

我认为问题是 splat route 总是期望在散列前面有类似的东西,没有孩子#settings/users不会接受?#settings

或者我在执行过程中遗漏了一些东西?

任何帮助或建议将不胜感激!
谢谢!

0 投票
1 回答
492 浏览

javascript - 配置子路由器以在父路由器视口 html 绑定中组合模块

目标: 我想要利用子路由器按应用程序的重要功能区域组织路由的隔离和封装优势。但是,我希望这些路由由父路由器视口绑定处理和组成。IE

<div id="parentRouterViewport" data-bind="router: { cacheViews: true }"><div>

到目前为止,我尝试过的所有事情,包括调用父路由器来委派路由(作为实验)都失败了。让我想知道这是否可能。

为简洁起见,我只包括路由的关键任务代码部分。

外壳.js

外壳.html

index.js(子路由模块)

唯一可行的方法是,如果我在相应的index.html视图中放置一个路由器视口绑定。但是,这不是我所追求的,基于我正在尝试设计的 css 布局和页面外观。一切都应该表示为一个面板,并在击中路线时换成不同的面板。目前,这种方法将有两个面板不断打开。看看下面的照片,更好地了解我的意思。

上述 CSS 布局问题的照片

0 投票
2 回答
313 浏览

javascript - 如何在 Durandal 中显示带有参数化路线的“未找到”页面

我有一个 Durandal 应用程序,router.mapUnknownRoutes如果 URL 不对应于已知路由,我会使用它来显示用户友好的错误页面。这很好用——如果我去,说/foo,并且与路线不匹配,那么指定的模块mapUnknownRoutes会正确显示。

但是,当我有参数化路由并且参数与后端的任何内容都不匹配时,我找不到任何方法来显示相同​​的错误页面。

例如,假设我有一条路线people/:slug,对应模块的activate方法如下所示:

如果我去,说/people/foo,那么结果取决于是dataService.load('foo')返回数据还是错误:

  • 如果foo后端存在,那么没问题 - 设置了可观察对象并继续组合。
  • 如果foo不存在,则抛出错误(因为没有catch)。这会导致未处理的错误,从而导致导航被取消并且路由器停止工作。

我知道我可以返回falsecanActivate并且导航将以更干净的方式取消,而不会破坏路由器。然而,这不是我想要的;我想要一个无效的 URL 来告诉用户出了点问题。

我知道我可以{ redirect: 'not-found' }canActivate. 然而,这很糟糕,因为它破坏了后退按钮——在重定向发生后,如果用户按下后退,他们会返回到/people/foo这会导致另一个错误,因此会再次重定向到not-found.

我尝试了几种不同的方法,主要涉及添加catch对 promise 定义的调用:

  • activate(或)是否可以canActivate通知路由器该路由实际上是无效的,就好像它从一开始就从未匹配过一样?
  • activate(or )是否可以canActivate发出 a rewrite(而不是 a redirect) 以便路由器在不更改 URL 的情况下显示不同的模块?
  • 我可以直接compose用其他模块代替当前模块(并取消当前模块的组成)吗?

我还尝试了一个空catch块,它吞噬了错误(我可以在这里添加一个 toast 来通知用户,这总比没有好)。然而,这会导致很多绑定错误,因为视图所期望的 observables 从未设置过。可能我可以将整个视图包装在if绑定中以防止错误,但这会导致空白页面而不是错误消息;或者我必须将错误消息放入每个可能无法检索其数据的视图中。无论哪种方式,这都是视图污染而不是 DRY,因为我应该只写一次“未找到”错误消息。

我只想要一个无效的 URL(特别是与路由匹配但包含无效参数值的 URL)来显示一个显示“找不到页面”的页面。当然,这也是其他人想要的吗?有什么办法可以做到这一点?

0 投票
1 回答
70 浏览

viewmodel - Durandal 导航到以模型为参数的视图

我想导航到一个视图 html 文件(从另一个视图的 js 文件),但传入该视图要使用的模型。请问我该怎么做。

当我在对话框中打开新视图时,我通常可以这样做。在这种情况下,我创建模型对象 ( var model = require('viewmodels/modeljsfile),然后创建此模型的实例并访问属性 ( var instance = new model(); instance.property1 = 'Test)。然后我将此实例传递给我的模态。

我不想在模式中打开视图 html,而是要重定向到实际视图。请问我该怎么做?

0 投票
0 回答
103 浏览

durandal - 如何在 Durandaljs 路由器中的“mapUnknownRoutes”之前运行“guardRoute”?

我正在使用Durandaljs中的路由器来控制 SPA 中的路由。在我的应用程序中,所有路由都是动态创建的。因此,我只使用mapUnknownRoutes来映射所有路线。我遇到的问题是,如果用户在同一页面中的不同哈希之间导航,单击“返回”会导致卸载当前页面——这是我希望阻止的。我想通过使用guardRoute来做到这一点,当导航保持在同一页面时返回'false',但'guardRoute'仅在'mapUnknownRoutes'之后运行,因此不会阻止当前页面的卸载。

有什么建议么?

谢谢 !

埃利尔

0 投票
0 回答
46 浏览

durandal - Durandal - 如何在具有不同编号的级别路由参数化模块。参数?

虽然将路由参数直接映射到 activate() 参数很方便,但它给我带来了参数化模块重用的问题。

走一条路线,例如

视图模型将被调用

现在, requestDetail 模块可以在导航中的不同位置和级别重用,就像这样

父路由器

子路由器

这具有调用 requestDetail vm 的效果

这显然是一个问题。有没有办法将传递的参数限制为来自子路由器的参数(这将解决问题)?

0 投票
1 回答
145 浏览

durandal - 如何将变量传递到 shell 或根视图模型中

我是杜兰达尔的新手。我只是想知道是否有一种方法可以通过查询字符串或任何其他方式将变量传递给根视图模型(即外壳)?

所以 main.js 看起来像下面这样

你能做一些类似于下面在 shell.js 文件中写的东西吗?我试过了,但它不起作用

我无法调用服务来获取 shell 中的数据,因为我想要的信息/变量作为查询字符串参数传递到通向 spa 的页面中。

那么,是否可以将某些东西传递到外壳中,或者是否有任何其他替代方法可以实现我想要的。就像创建一个 cookie 来存储这个变量并通过 shell.js 中的 javascript 读取它一样?

0 投票
1 回答
898 浏览

durandal-2.0 - 如何从 Durandal 路由器访问之前的路由

有没有办法从 Durandal.js 路由器访问先前的路由/指令?我知道我可以router.navigateBack()实际导航回去,但我想知道在触发导航之前我将导航回的路线。

0 投票
1 回答
83 浏览

javascript - Durandal 子视图未添加到历史记录并在使用浏览器的后退按钮时被忽略

在我正在处理的 Durandal 应用程序中,有一个顶部带有选项卡的页面,可将用户带入子视图。这些选项卡工作完美,配置如下:

我还有一个导航功能,每次单击选项卡时都会执行,如下所示:

页面的 URL 按预期更新。从默认管理子视图 ( .../#admin) 转到设置选项卡会将 URL 更新为.../#admin/settings. 但是问题是,尽管replace: true指定了视图更改,但似乎并未存储在浏览器历史记录中。

如果我在页面上打开一个新的浏览器选项卡#admin并导航到该#admin/settings页面,浏览器似乎认为在此之前唯一的历史条目是打开新选项卡:

浏览器缺乏历史

如果我随后完全离开该部分,我打开的最后一个选项卡似乎确实会在浏览器历史记录中被记住(在这种情况下,是我打开的设置选项卡),但事先访问#admin的主页没有条目:#admin

浏览器历史,但还不够

如果我从#adminto#admin/settings然后返回,#admin我只会在历史记录中看到对主 Admin 页面的引用,而没有提及 Settings 页面。

有谁知道我错过了什么会阻止每次子视图更改时更新历史记录?