bugfix> java > 投稿

以下は、状態のリストを返すJava Spring Controllerのスニペットです

国IDに関して州を取得する郵便配達員からのサンプルJSONの結果は次のとおりです。

[
    {
        "id": 1,
        "name": "state1",
        "country": {
            "id": 1,
            "name": "MyCountry"
        }
    },
    {
        "id": 2,
        "name": "state2",
        "country": {
            "id": 1,
            "name": "MyCountry"
        }
    },
    {
        "id": 3,
        "name": "state3",
        "country": {
            "id": 1,
            "name": "MyCountry"
        }
    },
    {
        "id": 4,
        "name": "state4",
        "country": {
            "id": 1,
            "name": "MyCountry"
        }
    },
    {
        "id": 5,
        "name": "state5",
        "country": {
            "id": 1,
            "name": "MyCountry"
        }
    }
]

状態リストを取得するために示されているように、角度でエンドポイントを使用しています。

               var myJSON = res.data;
                var states = [];
                angular.forEach(myJSON, function (item)
                        {
                    states.push(item);
                        });
                alert("500 "+ states);

状態リストは表示されず、状態のドロップダウンは表示されません。

回答 2 件
  • テンプレートに参照しているものに注意してください。

    まず、あなたのctrl.states (テンプレート参照)は同じオブジェクトではありません (コントローラー参照)。

    使用するかどうかを決定しますコントローラーインスタンス または$scopeインスタンス 参照をバインドします。


    一緒に働く$scope、コントローラーは次のようになります。

    $scope.states = [] ;
    angular.forEach(myJSON, function (item) {
        $scope.states.push(item);
    });
    
    

    そしてテンプレート:

    <label>State</label>
    <select ng-model="state" name="state" required >
        <option ng-repeat="s in states" value="{{s.name}}">{{s.name}}</option>
    </select>
    
    

    私はngRepeat あなたは複数の選択を繰り返しコンパイルする必要がないため、optionタグに代わりに、あなたの各要素にオプションを追加する必要があります オブジェクト。

    ngModelがで検出されたときにこれらを追加するAngularエンジンであるため、これらのクラスも削除します。素子

    それが役に立てば幸い。

  • 問題は配列参照にあると思います。もちろん、アイテムを配列にプッシュする必要があるので、以前と同じです。

    動作するコードの下で試してください

    注:スニペットでコードを実行しないでください。bcoz角度ライブラリは実行されず、リンクは追加されません。

    var myJSON = [
        {
            "id": 1,
            "name": "state1",
            "country": {
                "id": 1,
                "name": "MyCountry"
            }
        },
        {
            "id": 2,
            "name": "state2",
            "country": {
                "id": 1,
                "name": "MyCountry"
            }
        },
        {
            "id": 3,
            "name": "state3",
            "country": {
                "id": 1,
                "name": "MyCountry"
            }
        },
        {
            "id": 4,
            "name": "state4",
            "country": {
                "id": 1,
                "name": "MyCountry"
            }
        },
        {
            "id": 5,
            "name": "state5",
            "country": {
                "id": 1,
                "name": "MyCountry"
            }
        }
    ];
    
    $scope.states = [];
    angular.forEach(myJSON, function(item) {
      $scope.states.push(item);
    });
    alert($scope.states); //alertsthe values
    
    
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
    <label>State</label>
    <select ng-repeat="s in states" ng-model="state" formcontrol name="state" class="ng-untouched ng-pristine ng-invalid" required>
      <option value="{{s.name}}">{{s.name}}</option>
    </select>
    
    

あなたの答え