标签: aurelia

我正在努力学习如何使用Aurelia框架.这样做,我读的文档在这里对他们的结合事件的方法.文档建议默认使用委托.我已经在他们的一篇博客文章中提供了他们提供的插件,并添加了一点.完整的插件就在这里.

app.html

<template>
    <input value.bind="pageInput" blur.delegate="showAlert()" placeholder="delegate()" />
    <input value.bind="pageInput" blur.trigger="showAlert()" placeholder="trigger()" />

    <button type="button" click.delegate="showAlert()">delegate()</button>
    <button type="button" click.trigger="showAlert()">trigger()</button>
</template>

app.js

export class App {
  showAlert() {
    alert('showAlert()');
  }
}

正如你在plunkr中看到的那样,blur.trigger/click.delegate/click.trigger都会触发事件,但blur.delegate却没有.

为什么会这样？

你如何确定什么时候.delegate不起作用(当然没有手动测试)？

安装Aurelia导航骨架应用程序时,它所使用的所有第三方模块和现成的脚本都是压倒性的.对于那些在理论上对大部分内容有很好描述的人来说,如果我不能一步一步地学习,那就很难学习.出于这个原因,我想自己设置一个最小的Aurelia项目,然后随着我的进展增加复杂性.

主要问题:建立一个简单的Aurelia项目需要哪些步骤？

假设:

• 我已经有一个可以提供文件的节点服务器后端.
• 我想使用ES6/7(Babel).
• 我想使用system.js进行模块加载.
• 没有单元或e2e测试,没有样式,没有文档.
• 尽可能少的节点和jspm模块.

请对每一步做一些解释,并描述必要的Aurelia文件是什么和做什么.

我会非常感谢任何帮助:)

我有一个简单的重复.for:

<li repeat.for="item of items">${item}</li>

目前我正在使用:${$parent.items.indexOf(item)}.是否有速记,像角度的{{$ index}}？

大约两个月前,我们开始使用Rollbar通知我们Web应用程序中的各种错误.从那时起,我们偶尔会遇到错误:

ResizeObserver loop limit exceeded

令我困惑的是我们没有使用ResizeObserver,我调查了唯一一个我认为可能是罪魁祸首的插件,即:

Aurelia Resize

但它似乎也没有使用ResizeObserver.

令人困惑的是,这些错误消息自1月以来一直在发生,但ResizeObserver最近才向Chrome 65添加了支持.

给我们这个错误的浏览器版本是:

• Chrome:63.0.3239(超出ResizeObserver循环限制)
• Chrome:64.0.3282(超出ResizeObserver循环限制)
• 边缘:14.14393(SecurityError)
• 边缘:15.15063(SecurityError)

所以我想知道这是否可能是一个浏览器错误？或者可能是一个与实际无关的错误ResizeObserver？

使用Aurelia,我想填充<div>包含html文本的viewmodel属性(让我们称之为htmlText)的内容,我正在使用

<div>
${htmlText}
</div>

但是,这样编码html所以,而不是有段落或链接,所有标签都被转义,因此html可以被视为源.

有开箱即用的活页夹吗？

我在我的viewmodel上有一个属性,我想听,并根据其值触发事件,如下所示:

class viewModel {
  constructor() {
    this.value = '0';
    let val = 2;
    subscribe(this.value, callbackForValue);
    subscribe(val, callbackForVal);
  }
}

这是Aurelia的特色吗？如果是这样,我将如何设置这样的订阅？

我正在使用Aurelia JS编写应用程序.如何重定向到其他网址？有没有办法在不创建全新导航管道步骤的情况下实现这一目标？

谢谢

我一直在关注Contact Manager教程,并希望将Font Awesome添加到项目中.这是我到目前为止所做的:

• npm install Font-Awesome --save
• 在以下aurelia.json的依赖项数组下添加了以下内容vendor-bundle.js:

...
{
    "name": "font-awesome",
    "path": "../node_modules/font-awesome",
    "resources": [
      "css/font-awesome.min.css"
    ]
},
...

但是在运行时au run --watch我得到错误:

错误C:\ Users \node_modules\font-awesome.js

为什么要查找.js文件？

我最近问过为什么自闭合元素在Aurelia的模板系统中不起作用 ; 这是因为自闭元素是无效的html.

然而,今天我再次犯了同样的错误(这次是小部件)并且为什么内容丢失而一直在摸不着头脑.

问题:在gulp任务中是否需要消除Aurelia模板html的消毒？

我尝试过使用:

• gulp-htmlhint:无法让自闭元素出错
• gulp-htmllint:无法配置; 使用默认设置时会出现错误.
• gulp-html5-lint:看起来不可配置,它讨厌aurelia的属性.

您将如何访问Aurelia中的DOM元素？这是一个广泛而普遍的问题,但我感觉有一两种首选方法可以做到这一点.我现在在Aurelia有两个当前案例:

在模板中我有一个表格.我想访问视图模型中的表单元素,在VM canDeactivate()上,以中断用户导航离开半填充表单.因此,我尝试访问该元素的范围可以被视为本地.

在另一个视图模型中,我想在VM activate()上隐藏导航.导航驻留在另一个视图模型/模板对中,因此可以将范围视为全局.