Question

我正在使用版本2.10的ember js而我正在尝试从组件发送数据到路由。

这是我的组件模板

<div class="pull-right search-section">
    <form class="form-inline search-box" {{action save on="submit"}}>
      <button type="submit" class="btn"><i class="glyphicon glyphicon-search"></i></button>
      <div class="form-group">
        {{input value=search class="form-control" placeholder="Search anything"}}
      </div>
    </form>
    <a href="#" class="link-advance-search">Advance Search</a>
</div>

现在我正在尝试使用以下代码从组件js文件发送数据到路由从＆＃39; ember＆＃39;;

导入Ember

export default Ember.Component.extend({
  save: function () {
        var search = this.get('search');
        console.log(this.sendAction('saveAction',search));
  }
});

尝试使用以下代码获取路由js文件

import Ember from 'ember';
export default Ember.Route.extend({  
    actions: {
        saveAction: function(search_string){
            alert('fhdishf');
        }
    }
});

但遗憾的是没有得到任何东西。

提前致谢。

Answer 1

如果控制器未定义操作，您可以将操作发送到路径控制器，然后控制器会冒泡到路径。

// Component in Template
{{task-item content=task tasksController=this}}

// Component Action
actions: {
    copyTask: function(){
        this.get('tasksController').send('your-action');
    }
}

Answer 2

在模板文件中

{{task-item
  data=model
  innerActionName=outterActionName
}}

蠢货的做法是数据下降，动作。要将数据传回控制器/路由器，您必须调用上层操作（来自控制器/路由器）

在组件JavaScript文件中，

actions: {
  componentActionName(param) {
    this.sendAction("innerActionName", param);
  }
}

componentActionName是您需要放入模板文件中的内容，它触发组件JS文件中定义的函数。

在组件HBS文件中，

<div {{action "componentActionName" param}}>{{param}}</div>

{{action "componentActionName" param}}，是如何将参数传递回组件，然后传递给控制器/路由。

还有一件事

组件应该是隔离的，这意味着一个简单的组件不应该意识到周围的环境。只知道传入其中的数据，并且只能通过将操作和参数传递到正确的位置（路径）来执行数据操作。

如何从组件发送数据到路由ember？

2 个答案: