각도 표현

Question

Select/Option onchange() 이벤트에서 각도 표현식으로 JSON 파일의 값을 test ID div으로 작성해야합니다.

그러나 그것은 단지 문자열처럼 기록 : {{names[1].thnev}}

당신은 내가 무엇을 그리워 않았다 나를 도울 수 (나는 ID div에 수동으로 넣어 있다면, 그것은 작동합니다.)? (지난 4 시간 동안 ...) 고맙습니다.

<div ng-app="myApp" ng-controller="customersCtrl">  
    <select id="thaz" name="thaz" class="selectbox" onchange="onChange(this.value)"> 
     <option ng-repeat="x in names" value="{{x.id}}">{{x.id}} - {{x.thnev}}</option> 
    </select> 

    <div id="list"></div> 

</div> 

<script> 
    var app = angular.module('myApp', []); 
    app.controller('customersCtrl', function($scope, $http) { 
     $http.get("al_list_th.php") 
     .then(function (response) {$scope.names = response.data.records;}); 
    }); 

    function onChange(value) { 
     document.getElementById("list").innerHTML = "{{names[" + value + "].thnev}}"; 
    } 
</script> 

Answer 1

AngularJS가 제공하는 내장 기능을 사용하여 문제를 단순화 할 수 있습니다.

이 경우 ngModel을 사용하여 템플릿에 사용할 수있는 변수로 select 값을 바인딩 할 수 있습니다. 이 변수를 selectVal이라고합시다.

다음, 우리는 우리가이 출력에 살고 싶은 div의 내부에 직접 {{names[selectVal].thnev}}를 쓸 수 있습니다

내가 변경 보여 함께이 예제를 넣어했습니다.

var app = angular.module('myApp', []); 
 

 
app.controller('customersCtrl', function($scope, $http) { 
 

 
    $scope.selectVal = "default"; 
 
    $scope.names = [{id: 0, thnev: 5}, {id: 1, thnev: 6} ]; 
 

 
    //$http.get("al_list_th.php") 
 
    //.then(function (response) {$scope.names = response.data.records;}); 
 
});

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.min.js"></script> 
 

 
<div ng-app="myApp" ng-controller="customersCtrl"> 
 
     
 
    <select id="thaz" name="thaz" class="selectbox" ng-model="selectVal"> 
 
     <option value="default">None</option> 
 
     <option ng-repeat="x in names" value="{{x.id}}">{{x.id}} - {{x.thnev}}</option> 
 
    </select> 
 

 
    <div id="list"> 
 
    \t {{names[selectVal].thnev}} 
 
    </div> 
 

 
</div>

을

참고 : 내 코드에 추가로 option을 추가 했으므로 기본값이 반대가됩니다 d를 빈 초기 드롭 다운으로 변경하십시오. 이 작업을 수행 할 필요없이 코드는 코드없이 동일하게 작동합니다.