首页 > 解决方案 > Emblem.js 中子组件的数据向下绑定

问题描述

环境,带有 Emblem.js 的 Ember

在一个项目上工作,我试图使其模块化,以根据用户做出的选择动态地拉入正确的表单布局(子组件)。

我遇到的问题是我有一个子组件,其中引用了我试图访问以进行读取和写入的父级中的可变对象。

我相信我需要将数据绑定下来,然后根据 DDAU 将 mut 操作推回父级。

JS
Parent.js

export default Ember.Component.extend({
store: Ember.inject.service(),
name: null,
infoArray: Ember.computed.map(....),
isVisibleChild1: false;
actions: {
    picker() {
        if(dropdown.value==1)
            this.set('isVisibleChild1', true);
    }
},

Child1.js

needs to contain a variable childInfoArray somewhere

我在网上发现用 hbs 将数据从父表单绑定到子表单

{{Child1 childInfoArray=infoArray}}

但我使用的是 Emblem.js 而不是 hbs

Emblem.js
Parent.emblem

if isVisibleChild1
    = Child1
    childInfoArray = infoArray

Child1.emblem 我认识到 infoArray 可能应该是 childInfoArray

select id="newInfo" onchange={action (mut infoArray) value="target.value"}
    each optionsArray as |selectOption|
        option selected={is-equal selectOption.key infoArray} value="#{selectOption.key}" = selectOption.value

我不确定 childInfoArray 应该在 Child1.js 中的确切位置,我不完全确定如何将它绑定到 Child1.emblem 中的对象

任何帮助都会很棒!

有趣的旁注,我有几个文本输入字段和日期时间选择器。

将数据保存到数据库时,父组件会拾取日期时间选择器,但输入字段表示没有绑定到它们的对象。

标签: javascriptember.jscomponentsparent-childemblem.js

解决方案


我想通了,使用 = 我可以通过 Emblem 发送任何经典车把,解决方案比我想象的要简单得多

Child1.js

export default Ember.Component.extend({
    infoArray:null,
}

父标志

if isVisibleChild1
    = Child1 infoArray=infoArray

Child1.标志

select id="newInfo" onchange={action (mut infoArray) value="target.value"}

我可以用这种方式绑定一切

= Child1 infoArray=infoArray property2=property2 myFunction=myFunction

推荐阅读