2017-01-03 1 views
0

ng-repeat를 사용하여 프런트 엔드에서 AngularJS를 사용하여 REST API에서 내 응답을 채 웁니다. 나는 화면에 표시된 각 결과를 수정하는 옵션을 사용자에게 제공하고 있습니다. 사용자가 특정 사원의 값을 수정할 때 (즉, 드롭 다운을 변경한다고 가정), 해당 직원의 레코드 수정 링크를 클릭하면 다른 직원의 HTML에 반영됩니다. 검색 응답에있는 세부 정보가 HTML에 표시되도록하려면 어떻게해야합니까? 이것은 내 검색 응답특정 레코드의 값을 변경하면 ng-model의 값이 변경됩니다.

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 값을로드하는 데 사용되는 my 함수입니다. 내가 제대로 질문을 이해하면 HTML 내부 내가 NG 모델로 선언 한

$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> 
+0

귀하의 컨트롤러에서'$ scope.searchresponse = searchresponse'을하고 있다면 searchresponse ">"에서''의' bhantol

+0

그것을 시도, 그것은 작동하지 않았다. 나는 $ scope.searchresponse = response.data.items와 같은 응답을 할당하고있다. – Praveen

+0

컨트롤러 코드를 붙이면 잘못 된 것을 지적 할 수 있습니다. 어딘가에 response.data를 인쇄하는 것이 좋습니다. – bhantol

답변

0

입니다 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> 

포인트입니다, 당신은 세부 사항은 당신이 글로벌 형 변수에 수정 및되지 않도록 객체에서만 유형을 설정하고 있는지 확인해야합니다.

+0

내가하려고하는 것은 있습니다. 수정할 하이퍼 링크가있는 단일 페이지에서 ng-repeat를 사용하여 결과를 표시하고 있습니다. 사용자가 결과 페이지에 표시되는 데이터로 새 페이지 수정을 클릭하면 나타납니다. 여기에서 D에서 E로 값을 변경하면 (페이지 수정). 수정 링크를 클릭하면 다른 레코드에도 반영됩니다.범위 변수는 같습니다. HTML 만 변경됨 – Praveen

+0

그렇다면 ModifyEmployeeConfig 함수는 어디에 호출됩니까? – galit90

+0

결과 페이지 html에서 호출 중입니다. API 호출을하는 수정 함수와 검색 함수는 같은 컨트롤러 아래에 있습니다. – Praveen

관련 문제