问题标签 [aurelia-templating]

我正在开发一个现有的 SPA，我们逐步用 Aurelia 组件替换组件。我们enhance使用TemplatingEngine. 这工作得很好，但是当移动到应用程序的另一部分（不重新加载页面）时，我们还需要拆除那些增强的片段（删除事件侦听器，...）。

我的想法是将 aurelia 实例保留在页面中并重用它。

目前我增强这样的片段：

我增强的 HTML 如下所示：

我在自定义元素本身的函数中尝试了这个（DfElement::removeMyself()）：

但是从容器获取视图时出现错误（无法读取未定义的属性“资源”）。我从点击处理程序中调用了这个函数。

主要问题：如何手动触发 the及其unbind子项的和detached钩子？DfElement

额外问题：我的aurelia实例 ( window.DFAurelia)root 的属性host未定义：这是一件坏事吗？您是否发现这种增强（和不增强）页面中片段的方式存在任何潜在问题？

在 Aurelia 中，假设我有一个包含插值表达式的字符串"Today at ${value | date: 'time'}"和一些表示 this 的绑定上下文的对象{ value: new Date() }。有什么办法可以在视图之外，只取那个字符串和那个对象，并得到结果格式化的字符串，即"Today at 13:44"？

我查看了测试，但它们都涉及创建 HTML 元素、绑定和解除绑定 - 我想知道所有这些可能的性能开销，以及是否有更简单的方法来实现这一点？如果有一种轻量级的方法来针对上下文对象评估这样的字符串，而无需设置和拆除绑定等，那将是非常棒的。

我有一个基于行（类似表格）的自定义元素，它根据可绑定的列属性动态呈现其模板。它以字符串形式组成行模板，并使用ViewCompiler、ViewFactory和View进行渲染。

这工作正常，直到自定义模板包含标准 HTML 元素。一旦我开始将自定义元素放入模板中，它就会停止工作。它仍然呈现 HTML，但 Aurelia 没有附加自定义元素的行为。

我知道，所有自定义元素都应该“注册”才能使用。“正常注册”发生在视图 via<require>或 view-model@viewResources中，或全局注册。

然而，在这种特殊情况下，注入ViewCompiler只继承了视图模型父级的视图资源。我的问题是：如何注册任何其他视图资源？我知道ViewCompiler'scompile方法中的第二个参数，但无法使其工作。如果我在全球范围内注册它，我能够使它工作的唯一方法。

注意：这个问题的重点是注册视图资源。动态渲染效果很好

<compose>关于 Aurelia元素的快速问题。我曾希望用它来插入自定义元素作为表单控件，如下所示：

但是，它开始看起来<compose>元素仅限于接受model,view-model和view参数。那是对的吗？value将, data,等参数传递placeholder给我的自定义元素的最佳方法是什么control.type？

用我的解决方案编辑：

最后，Aurelia 似乎<compose>只适用于view,view-model和model属性。我的解决方案是像这样传递所有数据（可以是作为单个对象传递的多个项目）：

我发现有趣的是，当您使用 时，model.bind您不需要使用@bindable装饰器来接收参数。它们在视图中立即可用。

为了解决浏览器不喜欢表格正文中的表格元素的问题，我使用了一个自定义元素，tr如下所示：

但是，这会导致任何 DOM 事件处理程序（例如mouseenter.trigger我放置的）tr找不到自定义元素的视图模型中的处理程序。

因此，我尝试注入元素并在自定义元素本身中添加侦听器：

在这种情况下，事件触发得很好，并且它们命中了处理程序。这样做的问题是，在运行后的某个时间点，视图模型似乎attached丢失了元素。尽管我将注入的元素放入一个局部变量中，但当我稍后想在其中一个事件处理程序中使用它时，它是undefined.

我注意到，如果我调试事件处理程序，this实际上是tr元素，但我注入的元素变量是未定义的。在构造函数中，当我捕获注入的元素this是视图模型。

我究竟做错了什么？有没有更好的方法来实现这一目标？

我正在通过测试一个简单的 DOM 操作来试验 Aurelia 自定义属性。

令我惊讶的是，通过将椭圆节点附加到父 svg 节点来执行操作确实会修改 HTML，但不会呈现椭圆。

操作 innerHtml 属性确实按预期工作。

是否可以使用 appendNode() 而不是操作元素 innerHtml 来实现所需的结果？

我有一个两列布局设置，两列具有非常相似的功能，因此正在重用相同的视图模型。然而，渲染可能会略有不同，具体取决于渲染的哪一侧，所以想知道如何访问视口信息？

考虑这个设置：

应用程序.js

应用程序.html

模块1.js

我正在使用Aurelia。

我有一条post路线，它显示一个给定传递的帖子id。服务器编译用于将帖子写入 HTML 的 Markdown，我正在使用以下方法在模板中加载此内容：

当内容已附加到视图时，我找不到任何方法来执行功能。如果我只使用：

它将失败，因为尚未附加内容，因此我的功能要更改的元素尚不可用。我正在使用的当前解决方法是等待 200 毫秒，然后执行该函数。

有什么方法（事件或函数）可以知道何时附加了动态加载的内容？或者也许是另一种模板内容的方式innerHTML.bind？

<compose>我了解 Aurelia 的自定义元素与;的优缺点。Jeremy Danyow 的博客文章有所帮助。但是，我也想吃我的蛋糕。

我想创建我也可以动态组合的自定义元素。由于<compose>需要不同的实例化，使用它意味着我需要为每个元素创建两个并行版本——一个<compose>用于静态调用，一个用于静态调用。例如，考虑以下用例：

使用以下控件数据：

如您所见，我想静态和动态地使用<my-textbox>and 。<my-datepicker>自定义元素绝对是最好的方法。但是，如果不创建两个并行组件，我看不出如何实现这一点——一个设计为自定义元素，一个设计为可组合的视图/视图模型。

是否可以在运行时动态定义自定义组件模板中的元素类型？

我想避免在以下示例中重复buttonand元素的内部内容：a

是否可以写这样的东西：

我知道动态组合，<compose view="${widget.type}-view.html"></compose>但据我所知，这不允许我创建默认 HTML 元素，而只能创建自定义组件，对吗？

我在 Aurelia Gitter 上问过这个问题，Erik Lieben 建议使用@processContent(function)装饰器，替换给定内容中的内容function并返回true让 Aurelia 处理它。

不幸的是，我不知道如何实际应用这些说明，并希望在这里提供一些替代方法或有关如何实际完成此操作的一些细节。

编辑

我已经创建了相应的功能请求。即使已经提供了可能的解决方案，我也希望看到一些更简单的方法来解决这个问题；）