AngularJS（1.5.8） - 如何直接从获取json对象的控制器中填充选择选项列表？ - 编程

I have an AngularJS app that I want to populate a select drop down list from a JSON result.

我有一个AngularJS应用程序，我想从JSON结果填充选择下拉列表。

The controller code gets the json but how do I populate the $scope.states.

控制器代码获取json但是如何填充$ scope.states。

My drop down remains empty on the fetch and the res of the page does not render.

我的下拉在获取时仍然为空，并且页面的res不会呈现。

$scope.accountAddresses is a JSON container with various data. My concern is only for the shippingState key.

$ scope.accountAddresses是一个包含各种数据的JSON容器。我关心的只是shippingState密钥。

HTML Code

HTML代码

<select name="shippingState" id="shippingState"  ng-model="accountAddresses.shippingState"  class="state form-control" size="1">

Controller JSON Fetch Code

控制器JSON获取代码

 $http.get( serviceBase + 'Assets/us-states.json').success(function(d){
            $scope.states = d;
      });

I tried ng-repeat="state in $scope.states" but I do not get any data (state abbreviations) in the drop down.

我尝试了ng-repeat =“$ scope.states中的状态”但我没有在下拉列表中获得任何数据（状态缩写）。

JSON Sample Data

JSON示例数据

[
    {
        "name": "Alabama",
        "abbreviation": "AL"
    },
    {
        "name": "Alaska",
        "abbreviation": "AK"
    }]

How do I get the population to work like the following html code of options?

如何使人口像下面的html选项代码一样工作？

 <option value="AK">AK</option>
<option value="AL">AL</option>

EDIT

编辑

With the following code

使用以下代码

 <select name="shippingState" id="shippingState"  ng-model="accountAddresses.shippingState"  ng-options ="s.abbreviation as s.name for s in states" class="state form-control" size="1">

I get the following, but I need to remove "string:" and label

我得到以下内容，但我需要删除“string：”和标签

<option value="string:AL" label="Alabama">Alabama</option>
<option value="string:AK" label="Alaska">Alaska</option>

2 个解决方案

#1

You should be using ng-options for this.

您应该使用ng-options。

Depending on what you want to show:

取决于您要显示的内容：

<select ng-options="state as state.name for state in states track by state.abbreviation" ng-model="accountAddresses.shippingState"></select>

AngularJS（1.5.8） - 如何直接从获取json对象的控制器中填充选择选项列表？

2 个解决方案

#1

更多相关文章

随机推荐