如何使用angularjs填充json数据?

时间:2017-12-15 08:26:30

标签: javascript jquery angularjs json ajax

我一直在尝试使用带有angularjs的json数据填充可搜索的下拉列表,我已经在服务器中推送了json数据,并且如果我使用get方法,我已经能够从服务器接收响应。我不确切地知道如何查询json数据并在搜索栏中填充它们。 我附加了控制器脚本和html

var app=angular.module('myapp',[]);
app.controller('myctrl',function($scope,$http){
    $http({
        method:"GET",
        url:"http://localhost:5050/codes?val="}).then(function mySuccess(response){
        $scope.msg=response.data;
    },function myError(response){
        $scope.msg=response.statusText;
    });
});
<!DOCTYPE html>

信号

<body>
    <div ng-app="myapp" ng-controller="myctrl" >
        <select ng-model="search">
            <option ng-repeat="names in msg " value="{{names.value}}"></option>
            </select>
    </div>
</body>

这是我从本地主机向页面提供的示例json数据 我必须使用json数据的“value”部分填充搜索栏。

{"codes":
   [{"code": "NSE/AHLWEST", "value": "Asian Hotels (West) Limited"}, 
   {"code": "NSE/JINDALSWHL", "value": "Jindal South West Holding Limited"}, 
   {"code": "NSE/WIPL", "value": "The Western India Plywoods Limited"}, 
   {"code": "NSE/WSTCSTPAPR", "value": "West Coast Paper Mills Limited"}]
 }

2 个答案:

答案 0 :(得分:2)

需要访问beforeEach(() => { fixture = TestBed.createComponent(SomeComponent); component = fixture.componentInstance; component.a = 1; component.b = 2; fixture.detectChanges(); }); 属性。此方案中最好使用codes而不是ng-options

ng-repeat

答案 1 :(得分:1)

您需要访问 codes

<option ng-repeat="names in msg.codes " value="{{names.value}}"></option>