Question

我使用ng-repeat在前端使用AngularJS填充REST API的响应。我为用户提供了修改屏幕上显示的每个结果的选项。当用户修改特定员工的值时（假设他正在更改下拉列表），当点击该员工的修改记录链接时，其他员工的HTML也会反映出来。我应该怎么做才能在HTML中显示搜索响应中的详细信息。这是我的搜索回复

var searchresponse = [{
"items": [{
    "employeeId": "ABC",
    "type": "D",
    "alive": "Yes"

}, {
    "employeeId": "DEF",
    "type": "D",
    "alive": "Yes"

}, {
    "employeeId": "NPK",
    "type": "D",
    "alive": "Yes"

}, {
    "employeeId": "PKN",
    "type": "D",
    "alive": "Yes"
}],
"more": false
}];

控制器代码，我将结果设置为搜索响应

$http.post('http://localhost:8080/services/employee/search/'+Systems+"", searchCriteria)
.then(function(response) {

    $scope.searchresponse= [];
    $scope.searchresponse = response.data.items;
}

这是我如何在结果页面上以列表的形式显示值。

<tr ng-repeat="details in searchresponse">
<td class=list align=center ng-switch="details.type">
<span
ng-switch-when="D">SINGLE</span><span
ng-switch-when="E">MULTIPLE</span>
</td>

假设我将员工ABC的价值从D更改为E.当我点击员工PKN的修改链接时，它将被加载选择为E的下拉列表。为什么我为特定员工所做的更改会反映给其他员工。

这是我的函数，用于加载HTML的值。在HTML内部，我已将它们声明为ng-model

$scope.ModifyEmployeeConfig = function(details ){
$scope.type= "" ;
$scope.type=  details.type; // I tried printing the value and see here the value in response only getting printed
}

这是我的HTML

        <select name="type" class="pulldown1" id="type" ng-model="type">
        <option value="D">Single</option><option value="E">Multiple</option>
        </select>

Answer 1

如果我理解你的问题，看起来你正在改变类型变量，而不是下拉列表中的details.type变量。你想要做的是将你的下拉列表保留在ng-repeat中。那么您根本不需要具有ModifyEmployeeConfig功能。

如果需要，您只能在用户点击“修改”按钮时显示下拉列表。

这样的事情：

<tr ng-repeat="details in searchresponse">
    <td class="list" align="center" ng-switch="details.type">
        <span ng-switch-when="D">SINGLE</span>
        <span ng-switch-when="E">MULTIPLE</span>

        <button ng-if="!details.modify" ng-init="details.modify = false" ng-click="details.modify = true">Modify</button>

        <select ng-if="details.modify" class="pulldown1" id="type" ng-model="details.type">
            <option value="D">Single</option>
            <option value="E">Multiple</option>
        </select>
    </td>
</tr>

要点是，您必须确保仅在要修改的详细信息对象上设置类型，而不是在全局类型变量上设置类型。

当我们改变特定记录的值时，ng模型的值会发生变化

1 个答案: