Как вы можете использовать значение, сгенерированное в компоненте в форме родителя в Emberjs?

Question

В моем приложении Ember.js есть шаблон с формой для нескольких строк ввода пользователем. Одним из элементов ввода является сложная настройка, которую я хочу повторно использовать, поэтому я помещаю ее в компонент. Когда пользователь отправляет форму, но значение из компонента не отправляется. Как я могу это сделать?

Например, это шаблон с основной формой:

<script type='text/x-handlebars' data-template-name='userForm'> 
    // multiple inputs like this in the main template: 
    {{view Ember.TextField valueBinding="newName"}} 

    // and then I bring in the component: 
    {{profile-details}} 
    <button {{action addEntry}}>Add</button> 
</script> 

Компонент шаблона содержит поля ввода, а также, например:

{{input type='text' value=number valueBinding="monitor"}} 

То, что я хотел бы случиться что, когда пользователь нажимает кнопку в шаблоне, вызывая действие addEntry, значения из входов компонента идут вместе с входами шаблона в контроллер userForm. Как я могу это сделать? Спасибо

Answer 1

Так же, как вы можете передавать привязки к представлениям, вы можете передать их и компонентам. Итак, короткий ответ: вы объявите дополнительное свойство (назовем его profileInformation), который вы переходите в компонент profile-details. Любое взаимодействие компонента profile-details автоматически синхронизирует profileInformation с остальной частью вашего приложения.

Затем, в любой функции, связанной с действием addEntry, вы можете напрямую ссылаться на свою переменную переменной.

Так, например:

В шаблоне:

{{view Ember.TextField valueBinding="newName"}} 
{{profile-details profileInformationBinding="myProfileInformation"}} 
<button {{action addEntry}}>Add</button> 

И в контроллере:

actions: 
    addEntry: -> 
    # @get('myProfileInformation') --- you can access the details directly. 

И в компоненте, вы должны написать логику, которая удостоверяется profileInformation по-прежнему обновляется. Я не знаю точно, что такое ProfileDetailsComponent, но может быть что-то вроде вычислимого свойства, которое объединяет множество разных значений, полученных из компонента.

Обратите внимание, что в этом примере, profileInformation является собственностью ваш компонент видит, а myProfileInformation это свойство, что остальная часть вашего приложения видит. Разумеется, их можно было бы назвать одним и тем же.