如何将从子页面下拉列表中选择的值传递到父页面可编辑文本框

Question

在一个父页面上，我有一个图标，单击它会打开一个新的模式窗口。在该窗口中有一个下拉列表，从下拉列表中选择的值应显示在父页文本框中。

父页面html:

<input type="text" id="editGroupName" class="form-control"
style="width: 250px;" placeholder="Group Name"
ng-model="srchDealer.groupId" />
<i class="glyphicon glyphicon-new-window"
style="margin-top:10px; margin-left:10px; float:right; font-size:larger; cursor:pointer" 
ng-click="createNewGroupModal()"></i>

模式窗口html:

<select id="srchDealerGroup" ng-model="srchDealer.groupId"
ng-options="gr.id as gr.name for gr in dlrGroups"
style="width: 75%;" class="form-control">
<option value="" selected>Select Group</option>
</select>

如何将模式窗口中的下拉列表值与父窗口中的文本字段绑定？

Answer 1

为什么我们不能使用jQuery

$('#srchDealerGroup').change(function() {
$('#editGroupName').val(this.val());
// OR
$('#editGroupName').val(this.val($('#srchDealerGroup').val()));
});