Question

您好我正在使用emberJS处理表单，这是我的应用程序控制器

 App = Ember.Application.create();

 App.ApplicationController = Ember.Controller.extend({
    appName: 'Tag Editor',
    arrayVal : ['A', 'B', 'C', 'F', 'X'],
    actions: {
    formSubmit: function() {
         console.log(this.get('views'));
    }
   }
});

我的模板我正在使用应用程序应用程序模板，并且基于appcontroller emberview中提到的数组将按照App.TextView呈现

  <script type="text/x-handlebars" data-template-name="application">
    <div {{bind-attr class=":appName"}}><h1>{{appName}}</h1></div>
    {{#each arrayVal}}
     <div>
      {{view App.TextView entity=this}}
    </div>
   {{/each}}
   <div>
   <button {{action 'formSubmit'}}>Submit</button>
  </div>
</script>

//以上模板将根据波纹管模板

呈现模板中的所有文本框

//我的TextBoxView将包含2个文本框firstName和lastName

 <script type="text/x-handlebars" data-template-name="myentity-view">
     <div class="appTitle">{{input type=text value=firstName}}</div>
     <div class="appTitle">{{input type=text value=lastName}}</div>
 </script>

以上模板的视图

    App.TextView = Ember.View.extend({
        templateName: 'myentity-view'
    });

通过每个Helper渲染应用程序模板中的所有textBox视图并动态创建所有视图，这将正常工作

//但是对于我来说，在每个View中我都希望在单击applicationController中的formSubmit时捕获User的firstName和lastName的所有条目。

在当前场景中，我的arrayVal长度为5，它将根据我的代码动态创建5个TextView。并且在每个TextView中都有firstName和lastName，我如何捕获Controller动作中的所有firstName和lastNames

Answer 1

您可以使用this.get('childViews')访问视图。您可能希望使用TextView中的某个唯一属性过滤结果，以便忽略其他childView。然后你基本上映射整个数组并返回firstName和lastName。

formSubmit: function() {
  var values = this.get('childViews')
    .filterBy('templateName', 'myentity-view')
    .map(function(item) {
      return {
        firstName: item.get('firstName'),
        lastName: item.get('lastName')
      };
    });
}

Here is a working demo.

使用Ember View在控制器中捕获多个TextBox值

1 个答案: