1

(EmberJS 2.14)

我想拥有带有 ember 的 DRY 应用程序，但是，似乎不可能使用路由操作。当我尝试使用触发操作的按钮组件时，它失败了：

新的.js：

  export default Ember.Route.extend({
      model() {.....},
      actions: {
          saveStuff(newStuff) {
            newStuff.save().then(() => this.transitionTo('stuffs'));
          }

新的.hbs

{{basic-button texte="Create" theAction=(action 'saveStuff' model)}}

错误 ：

Assertion Failed: An action named 'saveStuff' was not found in (generated Stuffs.new controller)

我对删除操作和更新操作有同样的问题。我不能让自己在需要它的每条路线和视图中拥有相同的代码和模板行。

4

3 回答 3

4

路线不能很好地处理动作。有 3 个选项：

  1. 您可以使用此插件https://github.com/DockYard/ember-route-action-helper在路线中处理您的操作。这定义了一个要使用的助手，例如：

    {{basic-button texte="Create" theAction=(route-action 'saveStuff' 模型)}}

  2. 您可以在那里添加一个controllers/new.js控制器并处理操作。（编辑：如果您担心多个控制器，则可以将其添加到application控制器controllers/application.js中，如果您确实有全局操作（例如“注销”），它将处理顶部的所有操作

  3. 您可以将整个事物包装在一个组件中并传递模型。

于 2018-04-26T17:25:57.903 回答
1

我们只是想补充唐纳德已经给出的答案，并希望为您提供另一个示例，说明如何做您想要实现的目标。

正如您提到的“代码重用”，我想您已经在应用程序中使用了组件。当我想在多个路由之间重复使用相同的“保存”操作时，我通常会实现一个处理模型编辑和实际保存过程的组件。

例如，我的主应用程序共享相同的表单来创建和编辑instance. 在我的app/instances/new/template.hbs我正在使用一个edit-instance组件，然后我将在app/instances/edit/template.hbs

{{edit-instance instance=model}}

我在这里创建了一个 twiddle 来更详细地演示这个原则。它所做的另一件事是它实际上通过注入服务来封装组件内新实例的创建。store

export default Ember.Component.extend({
  store: Ember.inject.service(),
  ...
})

这是一个方便的小技巧，起初可能看起来很奇怪，因为所有文档示例仅显示使用route文件中的存储。在组件中使用 store 并不总是最佳实践，但是当您需要时，或者如果它简化了您的实现，它是一个有用的工具！

我不确定我是否支持 Twiddle 中示例的 UX/UI，但我认为它有助于解释一旦你尝试在组件内实现代码重用，你可以实现什么。

您可以在此 Ember Twiddle上看到整个示例，您可以在此 YouTube 视频上看到我们实时解决此问题

我希望这有帮助

于 2018-04-27T15:25:36.663 回答
0

我建议只创建一个控制器。我确实喜欢 Donald 的使用 DockYard 的 route-action-helper 的建议（这是一个很棒的包）。但即使它说你可能不需要它。

您可能不需要使用此插件。

如果您尝试不安装任何额外的软件包，我强烈建议您将操作移至控制器。控制器并没有被弃用，并且会出现一段时间，并且是为这些情况而设计的。如果您不熟悉控制器，我还建议您阅读他们参考的 DockYard 的这篇文章。

文章：https ://dockyard.com/blog/2017/06/16/ember-best-practices-what-are-controllers-good-for

于 2018-04-30T17:55:01.873 回答