Question

我有一个可用于选择对象的下拉列表。进行选择后，应用程序应使用该对象的属性在两个输入字段上设置值。我创建了下面的代码，但我无法设置输入字段的值。你能建议吗？

以下是视图

a1.txt, a2.txt ... an.txt

这是控制器。

import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;

Answer 1

{{}}总是返回字符串，所以最后你不会将javascript对象发送到你的控制器方法。

您可以使用 ng-options ，也可以发送索引并从控制器的数组中获取...

ng-options解决方案

<select ng-model="user" 
        ng-change="getPhoneAndEmail(user)" 
        ng-options="user as user.name for user in users">
</select>

索引解决方案

<select ng-model="user" ng-change="getPhoneAndEmail(user)">
   <option ng-repeat="user in users" value="{{$index}}">
       {{user.name}}
   </option>
</select>

和控制器

$scope.getPhoneAndEmail = function(index){
  var user = $scope.users[index];
  $scope.name = user.name;
  $scope.phone = user.phone;
}

Answer 2

你应该解析JSON，像这样改变它

  $scope.getPhoneAndEmail = function(user) {
      $scope.user =  JSON.parse(user);
      $scope.name = user.name;
      $scope.phone = user.phone;
      console.log(user);
    }

<强> DEMO

Answer 3

以下是您的代码的工作版本，请移除ng-change并使用ng-options代替。

function MyCtrl($scope) {
    $scope.user = {};
    $scope.user.name = "11";
    $scope.user.phone = "111";
    $scope.users = [{
        name: "Johnny",
        "parentId": "1",
        "email": "aa@aa.com",
        "phone": "2125551212"
    }, {
        name: "Kelvin",
        "parentId": "2",
        "email": "aa@aa.com",
        "phone": "2125551212"
    }, {
        name: "Jerry",
        "parentId": "3",
        "email": "aa@aa.com",
        "phone": "2125551212"
    }];
}

以下是HTML部分：

<div ng-app ng-controller="MyCtrl">
    <div class="row ui-section">
        <div class="col-lg-8 clearfix">
            <h2 class="section-header"></h2>
        </div>
        <div class="col-md-12">
            <select id="sel" class="input-block-level" ng-model="user" ng-options="user as user.name for user in users">    
        {{user.name}}
    </select>
            <input ng-model="user.name">
            <input ng-model="user.phone">
        </div>
    </div>
</div>

工作小提琴：

https://jsfiddle.net/jhuacsn6/1/

从下拉列表中设置文本输入元素的值

3 个答案: