如何使用 angularjs 填充 json 数据？

Posted

技术标签:

【中文标题】如何使用 angularjs 填充 json 数据？【英文标题】：How to populate the json data using angularjs? 【发布时间】：2018-05-29 10:19:26 【问题描述】：

我一直在尝试使用带有 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 数据的“值”部分填充搜索栏。

"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"]

【问题讨论】：

您正在接收 JSON 作为对象，因此最好在您的 ng-repeat 标签中使用 msg.codes 【参考方案1】：

需要访问codes 属性。在这种情况下，最好使用ng-options 而不是ng-repeat 

<select ng-model="search" ng-options="names.value as names.code for names in msg.codes"> 
</select>

【讨论】：

比你多 @SathishSridhar 没问题 :)【参考方案2】：

您需要访问codes

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

【讨论】：

比你好多了:) 上面的代码效果更好，我想我可以有多个答案。再次感谢:)

以上是关于如何使用 angularjs 填充 json 数据？的主要内容，如果未能解决你的问题，请参考以下文章

使用 dtOptions 访问 angularjs 数据表中的 json 数据

angularjs：依赖于json数据的动态html

如何在搜索功能上构建 AngularJS 引导模式

如何使用 AngularJS 从其他域（无回调函数）加载 JSON 数据对象

如何使用angularjs从json文件中获取数据

如何使用 angularJS restful 服务使用来自外部文件的 json 数据