在事件上将 ember 组件附加到 div

Question

我想知道如何在某种事件中将组件导入到 dom 中。即，如果您有一个带有电子邮件和密码的表单，并且对表单进行了验证，那么您如何在电子邮件 div 中输入一个 {{error-component message=message}}，其中消息将是“不是有效的电子邮件”，并在密码 div（或 td）中输入相同的组件，但显示不同的消息。

算法解释：

onSubmit(){ 验证表单： 如果电子邮件无效 { importComponent('#emailDiv', "电子邮件无效") } 如果密码无效 { importComponent('#passDiv', "密码没有足够的字符") } }

Answer 1

为什么不只设置告诉模板是否呈现错误的属性？

在控制器或组件中：

emailErrors: [],

actions: {
  onSubmit: function() {
    if (/* email not valid */) {
      this.get('emailErrors').addObject('Email not valid');
    }
  }
}

在模板中：

{{input value=email}}
{{#each error in emailErrors}}
  {{error}}
{{/each}}

这确实应该被制成组件，以便更好地封装和减少重复，但你明白了。我认为，以编程方式插入组件不是 Ember 方式。