ember.js 相关问题

如何在虚拟主机 proxypass 中使用前端应用程序？

我使用带有三个容器的 docker - 后端/前端/管理。我想使用这样的代理通行证导航到管理页面或前端 - 服务器名称 cookie.c...

Ember.js did-update 函数不触发

灰烬 5.x 我有一个父组件 Cases 和两个子组件。 CaseList 有很多项目，用户可以选择一项。这有效。并且 onCaseSelect 被调用。我想要导航栏...

Chrome 中的 Iframe 错误：无法从“窗口”读取“localStorage”：此文档的访问被拒绝

我有一个使用本地存储的网络应用程序。现在我们想通过 iframe 将此 Web 应用程序嵌入到其他（第三方）网站上。我们希望提供类似于 youtube 的 iframe 嵌入，以便其他网站可以...

如何在 ember JS 中形成表格时使用 #if 来使用多个条件？

我正在使用 Ember 动态形成一个表 我如何在形成表格时使用嵌套 if 像这样的东西 {{#if ismorethanone && model.hasSize}} <...

未捕获错误：找不到从“web-app/app”导入的模块“@ember/application”

当我尝试从 Ember.js 项目中的“web-app/app”导入它时，为什么会遇到错误“未捕获错误：找不到模块@ember/application”？ 眼镜： npm：6.14.5 节点：v14.4.0 嵌入...

监听 Ember 组件外部点击的正确方法是什么？

我有一个名为 header-main.js 的 Ember.js 组件，其模板为 header-main.hbs。在 Handlebars 文件中，我有这样的内容： 我有一个名为 header-main.js 的 Ember.js 组件，其模板为 header-main.hbs。在 Handlebars 文件中，我有这样的内容： <ul id="header-nav"> <li class="unopened"> <a href="javascript:void(0);">Brand</a> <ul class="dropdown"> <li><a href="javascript:void(0);">Lenovo</a></li> <li><a href="javascript:void(0);">Dell</a></li> <li><a href="javascript:void(0);">HP</a></li> </ul> </li> </ul> 在组件的 didInsertElement 挂钩中，我有一些 jQuery 可以更改 <li> 标签的类以显示如下下拉菜单： didInsertElement: function() { this.$('#header-nav li > a').click(function() { var currentState = $(this).parent().attr('class'); if (class === 'unopened') { $(this).parent().attr('class', 'open'); } else { $(this).parent().attr('class', 'unopened'); } }); } 这一切都很好，除了它强制用户只能单击按钮来切换下拉菜单，这与大多数网站不同，大多数网站只需单击窗口中的任意位置即可关闭下拉菜单。确保可以通过单击窗口中的任意位置来关闭此组件内的下拉列表的正确方法是什么？我在模态窗口中也面临类似的情况。 使用 JQuery focusout() 定义关闭操作。 因此，每当组件失去焦点时，即外部有一个点击，它就应该关闭。 这是非常过时的（但这是一个老问题）。为了帮助未来的工程师寻找答案，从 EmberJS 3.28+ 开始，他们开始使用 modifiers 来处理此事件和其他组件事件。 请参阅 EmberJS 5 组件文档了解详细信息，具体来说，有一个示例 on-click-outside 解释了如何执行此操作。 注意：在 EmberJS 3.x、4.x 中，您需要安装 ember-modifier 包才能执行此操作。它完全集成在 EmberJS 5 中，无需额外的软件包。

ember js - 使用服务来显示数据

我是 ember js 新手，正在尝试编写我的第一个应用程序...... 我有 ： 服务应用程序/service/event_handler.js 从“@ember/service”导入服务； 导出默认类 EventHandlerService 扩展 Servic...

Node v20.10.0 未针对您平台上的 Ember CLI 进行测试

当我尝试启动新的 ember 项目时遇到错误。 我刚刚使用以下命令安装了 ember： npm install -g ember-cli 然后我运行： ember init 来创建我的项目，但它抛出了以下错误...

unshiftObject 方法在 ember 中不起作用

我有对象数组，只想连接所有对象的列表属性并创建一个新数组。所以我在下面的代码中有一个“combinedList”吸气剂来组合列表如果数组

Ember 4.x (Octane) - 观察者的替代品？

我即将完成将一个非常旧的 Ember.js 项目从 2.13 一直升级到最新的 LTS 版本 4.12。一路走来，我一直在努力应对 Octane 发布的变化，兄弟……

在 Handlebars.js 辅助参数中连接字符串和变量的合理方法？

我正在尝试在 Ember 中构建一个简单的模态组件，但似乎 Handlebars 的“无逻辑”对我来说太不合逻辑了。有没有什么明智的方法可以达到这样的结果？ &...

如何将对象传输到ember.js中的组件

Ember.js 对我来说是全新的。 （当前版本5.4） 我想构建一个小型的 WebUI。登录和菜单导航效果很好。但我在循环和可视化信息方面遇到问题......

在 Emberjs 5.4 中加载路线时热滚动到窗口顶部

在Ember 5.4中，当加载新路线并且滚动最后一个视图时，滚动位置保持不变。如果 url/路由发生变化，我希望它立即滚动到窗口顶部。 我让它工作了

观察emberjs模板中json对象的变化

如何观察ember模板中json对象的变化，这是我的测试代码，我希望在点击updateJson后显示jsonChange按钮，但它没有 测试.hbs 如何观察ember模板中json对象的变化，这是我的测试代码，我希望在点击updateJson后显示jsonChange按钮，但没有 测试.hbs <button {{on "click" this.updateJson}} >updateJson</button> {{#if this.testJsonChanges}} <button>jsonChange</button> {{/if}} 测试.js export default class TestController extends Controller { @tracked testjson = {key1:'value1', key2:'value2'}; @action updateJson() { this.testjson.key1 = 'valuex'; } get testJsonChanges() { return this.testjson.key1 != 'value1'; } } @tracked 仅适用于引用，就像 const 仅在引用上是常量一样 - 如果您希望跟踪属性的更改，则需要使用 TrackedObject import { TrackedObject } from 'tracked-built-ins'; export default class TestController extends Controller { testjson = new TrackedObject({key1:'value1', key2:'value2'}); @action updateJson() { this.testjson.key1 = 'valuex'; } get testJsonChanges() { return this.testjson.key1 != 'value1'; } }

点击具有特定属性的元素时自动触发 Ember 中的操作

如何在 Ember 3.11 项目中单击包含特定属性的元素时自动触发操作？ 目前，我的结构如下： myComponent.js： 出口定义...

Ember-cli 不使用全局版本

这实际上可能更多是 npm/node 而不仅仅是 EmberJS 问题。 简而言之，我运行了 npm install -g ember-cli。但是，当我使用 ember --version 检查版本时，它显示了我 ember-cli：3.10.1

Ember 控制器、承诺以及可能响应用户搜索的重新渲染模板

我有一个 Ember 应用程序，并且是初学者。最终用户可以通过一个表单按特定日期搜索该特定项目。控制器看起来像（并在问题中发表评论）： 应用程序。

如何在ember（hbs）中的复选框上添加onclick事件

我已与 Ember 一起添加到项目中。不幸的是我只知道 AngularJS。无论如何，我要做的就是在复选框上添加 onclick 事件。我尝试过使用观察者但没有太多成功......

当 Ennber 辛烷中的参数发生变化时，如何触发组件内部的函数

所以我在控制器中有一个像这样的父级 从“@ember/controller”导入控制器； 导出默认类 IndexController 扩展 Controller { @service firebaseApp； @服务快速启动； @追踪你...

为什么embe.rjs在模板中看不到我的控制器方法？

项目中，我有模板输入： {{#if (communicationPreferenceIs '电话')}} ... 在项目中，我有模板输入： {{#if (communicationPreferenceIs 'Phone')}} <div class="row"> <div class="col-md-4 form-label"> Phone<i class="required">*</i> </div> <div class="col-md-8"> {{input-validation type="text" required=true class="form-control" value=model.phone placeholder="Phone" pattern="[0-9]*" maxlength="30" onkeydown="" key-down="validateInput" }} </div> </div> {{/if}} 我需要一个条件渲染并将其包装在 if 构造中。在其中，我使用控制器中的方法 communicationPreferenceIs 来检查该值。这是它的代码： App.EditController = Ember.Controller.extend(Ember.Evented, { communicationPreferenceIs: function(preference) { const model = this.get('model'); if (!model.communicationPreference || !model.communicationPreference.name) { return false; } const currentPreference = model.communicationPreference.name; return currentPreference === preference; }.property('model.communicationPreference'), } 因此，在渲染时，我收到了 ember 错误： "Assertion Failed: A helper named 'communicationPreferenceIs' could not be found" 我试验了一下，发现这个方法有效： communicationPreferencePhone: function() { const model = this.get('model'); return ( model.communicationPreference && model.communicationPreference.name === 'Phone' ); }.property('model.communicationPreference'), 如果我在模式下使用它： {{#if communicationPreferencePhone }} 效果很好。如何让communicationPreferenceIs更通用？ 您看过此页面吗？ 全局辅助函数 要使用全局可用的辅助函数，您需要将它们放在 app/helpers 文件夹中。 在经典系统中，您可以使用短横线大小写来引用助手。 所以， 定义app/helpers/communication-preference-is.js export default .... 通过 {{communication-preference-is this.model "Phone"}} 调用 或者通过 {{otherFunction (communication-preference-is this.model "Phone")}} 作为子表达式 就像 if 语句中发生的那样： {{#if (communication-preference-is this.model "Phone")}} {{/if}} 语法注意事项： {{ }} 用于转义 HTML ( ) 用于子表达式（例如：调用 communications-preferenc-is） {{#区块开始 {{/区块结束 空间上： {{ }} for escaping HTML # start of block / end of block ( ) sub expression ( ) sub expression (nested) 请注意，在 ember-source 4.5 之前，必须将助手包装在额外的函数中，helper // app/helpers/communication-preference-is.js import { helper } from '@ember/component/helper'; export default helper(function communicationPreferenceIs(positionalArgs, namedArgs) { let [model, type] = positionalArgs; return ( model.communicationPreference && model.communicationPreference.name === type ); }); 在 [email protected] 之后，你就能够 export default function communicationPreferenceIs(model, type) { return ( model.communicationPreference && model.communicationPreference.name === type ); } 使用 Ember Polaris（3.28+ 支持），您可以导入帮助器而不是依赖全局变量： import communicationPreferenceIs from 'app-name/helpers/communication-preference-is'; <template> {{communicationPreferenceIs @model "Phone"}} </template> 但在那一点上，您可能需要一个 app-name/helpers 文件，您可以从中导入任何内容，而不是每个助手导入一次。