2014-12-23 1 views
0

내가 아약스 JSON 데이터와 부트 스트랩 모달 내 선택 옵션을 채우기 위해 시도하고 2 해결하지만, 데이터를 출력AngularJS와는 NG 반복 및 NG-옵션

최초의 마크 업의 비를 사용하는 데 부트 스트랩 모달에 출력되지 옵션을 NG-옵션

<div class="form-group" ng-show="formInfo.sourceType =='api'"> 
      {{ API }} 
      <label for="selectAPI" class="col-sm-2 control-label">Select API</label> 
      <div class="col-sm-8"> 
       <select ng-model="selectedAPI" class="form-control"> 
       <option value="{{item.id}}" ng-repeat="(i,item) in networks"> {{item.name}}</option> 
      </select> 
      <pre>{{ networks }}</pre> 
    </div> 

두 번째 NG 반복과

<div class="form-group" ng-show="formInfo.sourceType =='api'"> 
      {{ API }} 
      <label for="selectAPI" class="col-sm-2 control-label">Select API</label> 
      <div class="col-sm-8"> 
       <select ng-model="selectedAPI" ng-options="item.name for item in networks" class="form-control"> </select> 
      <pre>{{ networks }}</pre> 
    </div> 

컨트롤러

$request('onAPI', {success: function(data, scope){ 
      this.success(data).done(function() { 
        $scope.networks = []; 
        $scope.networks = angular.fromJson(data.result); 
        $scope.selectedAPI = null; 
       //$scope.selectedAPI = $scope.apis[0]; 
       console.log($scope.networks); // I have output 

      }); 
     } 
    }); 

[{ 
     "id":"1", 
     "name":"Zanox" 
     },{ 
     "id":"2", 
     "name":"Affilinet", 

    }] 

그것이

var ModalInstanceCtrl = function ($scope, $modalInstance, items, $request) { 

    $scope.items = items; 
    $request('onAPI', {success: function(data, scope){ 
      this.success(data).done(function() { 
        $scope.networks = []; 
        $scope.networks = angular.fromJson(data.result); 
        $scope.selectedAPI = null; 
       //$scope.selectedAPI = $scope.apis[0]; 
       console.log($scope.networks); 

      }); 
     } 
    }); 

}; 

답변

0

작업 당함 응답 JSON이

<select ng-model="selectedAPI" class="form-control" 
    ng-options = "item.name as item.name for item in networks" > 
</select> 
+0

도 작동하지 않는 것 같습니다 – fefe

+0

각도 js 공식 설명서에서 ng-options 사용 방법을 확인한 다음 –

+0

을 확인하십시오. – fefe

0
시도

먼저, 선택된 모델의 API에는 값이없는 것처럼 보이며 기본적으로 빈 옵션이 만들어집니다. 둘째, 비동기 http 요청에 ajax를 사용하면 응답이 제 시간에 생성되지 않을 수 있습니다. 따라서 $ scope. $ apply 메소드를 사용하여 AngularJS 데이터를 다시로드 할 수 있습니다. 좋아요 :

$request('onAPI', {success: function(data, scope){ 
      this.success(data).done(function() { 
       $scope.$apply(function(){ 
         $scope.networks = []; 
         $scope.networks = angular.fromJson(data.result); 
         $scope.selectedAPI = null; 
        //$scope.selectedAPI = $scope.apis[0]; 
        console.log($scope.networks); // I have output 
       }); 
      }); 
     } 
    }); 

작동 여부를 알려주세요. 감사.