Question

我有3个输入字段，第一个字段是select类型，其余两个是text类型。现在，如果我从下拉列表中选择一个值，则相应的值应出现在剩余的两个输入字段中。如何在AngularJS中完成。谢谢！

例如如果我从下拉列表中选择User1，那么User1对应的电子邮件＆amp;电话号码应出现在相应的输入字段中。

注意：根据所选选项

从数据库中提取值

<select>
    <option value="user1">User1</option>
    <option value="user2">User2</option>
    <option value="user3">User3</option>
    <option value="user4">User4</option>
</select>
<input type="text" id="eamil" placeholder="Email">
<input type="text" id="phone_no" placeholder="Phone number">

Answer 1

<select ng-options="s as s in Users" ng-model="user" ng-change = "GetData(user)">

<input type="text" id="eamil" placeholder="Email" ng-model="userEmail">

<input type="text" id="phone_no" placeholder="Phone number" ng-model="userPhone">

现在在控制器上

$scope.GetData = function(user){
  // Here Please add Code to fetch the data from database. Here userEmailFromDB and userPhoneFromDB are the values that you get from database. 

   $scope.userEmail = userEmailFromDB; 
   $scope.userPhone = userPhoneFromDB;
}

Answer 2

$scope.userListSelected = function(userList){ $scope.email = userList.email; $scope.phoneNumber = userList.phoneNumber;

<select ng-model="userList" ng-options="user.name for user in userData" ng-change="userListSelected(userList)">

<input type=text ng-model="email" />
<input type=text ng-model="phoneNumber"/>

Answer 3

我有类似的东西，可能会有所帮助：

＆＃13;

$scope.onChangeSelectedUser = function(item) {
  $scope.user.user_id = item.id;
}
    
$scope.selectedUser = [];

＆＃13;

<select class="form-control with-search" select-picker data-live-search="true" title="Select User" ng-model="selectedUser"
ng-options="u as u.email for u in users"
ng-change="onChangeSelectedUser(selectedUser)">
</select>

<input type="text" readonly class="form-control" ng-model="selectedUser.user_id"/>        
<input type="text" readonly class="form-control" ng-model="selectedUser.email"/>
<input type="text" readonly class="form-control" ng-model="selectedUser.phone_no"/>

＆＃13;

根据AngularJS中所选选项填充输入

3 个答案: