24

オブジェクトの配列を使用しようとしています

 (array = [{name: 'Moe', id:1}, {name: 'Larry', id:2}, {name: 'Curly', id:3}]) 

AngularJS 入力フォーム内のドロップダウン選択として、例がどうしても必要です。誰でも私を啓発できるjsFiddleを教えてもらえますか?

4

3 に答える 3

87

可能な場合は ng-options を使用することをお勧めします。

<select ng-model="choice" ng-options="x.id as x.name for x in array"></select>

これをチェックしてください:実際のオブジェクトを選択するために使用できます:

app.controller('ExampleCtrl', function($scope) {
    $scope.items = [
        { id: 1, name: 'Foo' },
        { id: 2, name: 'Bar' }
    ];

    $scope.selectedItem = null;
});
<div ng-controller="ExampleCtrl">
    <select ng-model="selectedItem" 
            ng-options="item as item.name for item in items"></select>

    {{selectedItem | json}}
</div>

上記の例では、ドロップダウンから何かを選択すると、実際には、値の型だけではなく、selectedItem にオブジェクト参照全体が設定されます。

注: ng-options を使用すると、value=""属性がコレクション内のアイテムのインデックスに設定されます。これは仕様によるものです

それは本当にそれを行うための最良の方法です。

編集: 要求に応じてより多くのコンテキスト。また、ここに使用中のプランカーがあります

于 2013-02-11T18:51:14.633 に答える
21
<select ng-model="choice">
    <option ng-repeat="obj in array" value="{{obj.id}}">{{obj.name}}</option>
</select>

または「ng-options」を使用 - http://docs.angularjs.org/api/ng.directive:select

于 2013-02-11T17:58:52.747 に答える
2
<dropdown-multiselect pre-selected="member.roles" model="selected_items" options="roles"></dropdown-multiselect>


<pre>selected roles = {{selected_items | json}}</pre>

于 2015-10-29T11:07:40.960 に答える