【问题标题】:Ember.js - Open modal action won't bubble out of componentEmber.js - 打开模式操作不会从组件中冒出
【发布时间】:2014-05-29 02:24:10
【问题描述】:

我遵循了 Ember.js 的 Using Modal Dialogs 并在 ApplicationRoute 中放置了一个动作处理程序。在我尝试在组件的模板中使用相同的操作之前,效果很好,在这种情况下,它不会在控制台中执行以下错误:Uncaught Error: Assertion Failed: Thetargetfor <appkit@component:user-info::ember451> (49.5) does not have asendmethod

Here's 一个展示我的问题的 JSBin。注意在索引模板中指定的动作如何调用模态,而在组件中指定的动作却没有。 JSBin 的要点是这样的:

索引模板

<!-- this creates the modal successfully -->
<button {{action "openModal" "modal-login"}}>open a modal (not in a component)</button>

<!-- this component has the same button as above in code, but clicking the button doesnt work -->
{{user-info}}

用户信息组件模板

<button {{action "openModal" "modal-login"}}>open a modal(in a component)</button>

我已经找到了解决这个问题的方法,但是它非常hacky,并且在我的组件中添加了很多代码。在组件声明中,我复制了“openModal”操作,并通过组件上的注册操作like so 使其发送操作。

【问题讨论】:

    标签: javascript ember.js


    【解决方案1】:

    您需要将操作发送到路由器操作。像这样:

    App.UserInfoComponent = Ember.Component.extend({
      actions: {
            openModal: function(modalName) {
              console.log(modalName);      this.sendAction('openModal',modalName);
                }
            }
    });
    

    这是一个带有工作解决方案的 jsbin: http://jsbin.com/fijujikape/1/edit?html,js,console,output

    【讨论】:

      【解决方案2】:

      您的修复是预期的行为,组件模板内触发的操作旨在由组件处理。必要时,您可以按照指南示例重定向您的操作。

      如果您希望您的组件操作针对控制器/路由约定流程,您必须将操作设置到组件本身,而不是在组件子视图中。

       {{user-info tagName='button' 
         action='openModal' 
         context='modal-login' }}
      

      http://jsbin.com/takatoyi/2/edit

      【讨论】:

      • 这不起作用..组件内部的模态仍然无法打开。
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2018-03-17
      • 2020-09-11
      • 1970-01-01
      • 1970-01-01
      • 2017-06-14
      相关资源
      最近更新 更多