Question

我想在select下拉列表中传递两个值。这是我的代码。

<tbody>
    <tr ng-repeat="x in studyTeamObj" align="center">
        <td>
            <select class="form-control" ng-model="x.Designation">
                <option value=""></option>
                <option ng-repeat="x in createStudyObj.Study_User"
                        value="{{x.Designation}}">{{x.Emp_Name}}
                </option>
            </select>
        </td>
        <td>
            {{x.Emp_Id}}
        </td>
        <td>
            {{x.Designation}}
        </td>
        <td class="mdrf-add-row-col">
            <i class="fa  fa-minus-circle"
               data-ng-click="deleteMem($index)"></i>
        </td>
    </tr>
</tbody>

这是我从{{createStudyObj.Study_User}}获取的数据

[{"Emp_Name":"mdrf","Emp_Id":2,"Designation":"Research Dietitian","DesignationID":20},{"Emp_Name":"Sudha","Emp_Id":1045,"Designation":"MDRF HOD","DesignationID":16},{"Emp_Name":"kavyad","Emp_Id":1046,"Designation":"MDRF HOD","DesignationID":16},{"Emp_Name":"kavyad","Emp_Id":1047,"Designation":"MDRF HOD","DesignationID":16},{"Emp_Name":"kavyad","Emp_Id":1048,"Designation":"MDRF HOD","DesignationID":16},{"Emp_Name":"kavyad","Emp_Id":1049,"Designation":"MDRF HOD","DesignationID":16},{"Emp_Name":"fdgedd","Emp_Id":1050,"Designation":"MDRF HOD","DesignationID":16}]

当我从下拉列表中点击emp名称时，它应该获取Emp_Id和Designation.But我只获得了Designation.Plz帮助

Answer 1

您应该使用ng-options而不是构建自己的选项列表。 https://docs.angularjs.org/api/ng/directive/ngOptions

如果您遇到问题，请将这些问题添加到最顶层，我会更新我的答案。

Answer 2

将对象分配给char*而不是一个属性。这就是整个对象绑定到value的方式，您可以从中过滤相关属性。

ng-model

当你从控制器值中分配为模型变量时，这就是你的模型变量。所以你需要使用<option ng-repeat="x in createStudyObj.Study_User"value="{{x}}">{{x.Emp_Name}} </option>

将值解析为对象

JSON.parse()

＆＃13;

$scope.designation = JSON.parse($scope.designation)

＆＃13;

angular.module("app",[])
.controller("ctrl",function($scope){
 $scope.createStudyObj = {};
 $scope.createStudyObj.Study_User = [{"Emp_Name":"mdrf","Emp_Id":2,"Designation":"Research Dietitian","DesignationID":20},{"Emp_Name":"Sudha","Emp_Id":1045,"Designation":"MDRF HOD","DesignationID":16},{"Emp_Name":"kavyad","Emp_Id":1046,"Designation":"MDRF HOD","DesignationID":16},{"Emp_Name":"kavyad","Emp_Id":1047,"Designation":"MDRF HOD","DesignationID":16},{"Emp_Name":"kavyad","Emp_Id":1048,"Designation":"MDRF HOD","DesignationID":16},{"Emp_Name":"kavyad","Emp_Id":1049,"Designation":"MDRF HOD","DesignationID":16},{"Emp_Name":"fdgedd","Emp_Id":1050,"Designation":"MDRF HOD","DesignationID":16}]


})

＆＃13;

但我建议使用<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="app" ng-controller="ctrl"> <table> <tbody> <tr > <td> <select class="form-control" ng-model="designation"> <option value=""></option> <option ng-repeat="x in createStudyObj.Study_User" value="{{x}}">{{x.Emp_Name}} </option> </select> </td> <td> {{designation}} </td> <td class="mdrf-add-row-col"> <i class="fa fa-minus-circle" data-ng-click="deleteMem($index)"></i> </td> </tr> </tbody> </table> </div>代替ng-options

＆＃13;

ng-repeat

＆＃13;

angular.module("app",[])
.controller("ctrl",function($scope){
 $scope.createStudyObj = {};
 $scope.createStudyObj.Study_User = [{"Emp_Name":"mdrf","Emp_Id":2,"Designation":"Research Dietitian","DesignationID":20},{"Emp_Name":"Sudha","Emp_Id":1045,"Designation":"MDRF HOD","DesignationID":16},{"Emp_Name":"kavyad","Emp_Id":1046,"Designation":"MDRF HOD","DesignationID":16},{"Emp_Name":"kavyad","Emp_Id":1047,"Designation":"MDRF HOD","DesignationID":16},{"Emp_Name":"kavyad","Emp_Id":1048,"Designation":"MDRF HOD","DesignationID":16},{"Emp_Name":"kavyad","Emp_Id":1049,"Designation":"MDRF HOD","DesignationID":16},{"Emp_Name":"fdgedd","Emp_Id":1050,"Designation":"MDRF HOD","DesignationID":16}]


})

＆＃13;

使用angularjs在选择下拉列表中传递两个值

2 个答案: