1

おそらく何度も議論されている単純な問題ですが、この単純な問題について適切な解決策が見つかりません。

問題: ダルトンを選択できるのに、選択したダルトンが select-element に表示されないのはなぜですか?

コントローラ：

var myApp = angular.module('myApp', ['ui.select2']);

function MyCtrl($scope) {
    $scope.daltons = [
        { id: 10, name: 'Joe' },
        { id: 20, name: 'William' },
        { id: 30, name: 'Jack' },
        { id: 40, name: 'Averell' },
        { id: 50, name: 'Ma' }
    ];
    $scope.selectedDaltons = [40]; // Averell is preselected 
};

意見：

<div ng-controller="MyCtrl">
    <label for="1">Please select items:</label>
    <select id="1"
            ui-select2
            multiple
            ng-model='selectedDaltons'
            ng-options="dalton.id as dalton.name for dalton in daltons">
    </select>
    <label for="2">Selected Items:</label>
    <ul id="2">
        <li ng-repeat="dalton in selectedDaltons">{{dalton}}</li>
    </ul>
</div>

ここではjsfiddleとして

4

1 に答える 1

3

問題は、ng-options が ui-select2 でサポートされていないことだと思います。オプションタグとng-repeatを使用して、フィドルを作り直しました：

http://jsfiddle.net/u48j0yyc/1/

<div ng-controller="MyCtrl">
    <label>Please select items:</label>
    <select ui-select2 multiple ng-model='selectedDaltons'>
        <option ng-repeat="d in daltons" ng-bind="d.name" value="{{ d.id }}"></option>
    </select>
    <label>Selected Items:</label>
    <ul>
        <div ng-bind="selectedDaltons"></div>
    </ul>
</div>


var myApp = angular.module('myApp', ['ui.select2']);
function MyCtrl($scope) {
    $scope.daltons = [
        { id: 10, name: 'Joe' },
        { id: 20, name: 'William' },
        { id: 30, name: 'Jack' },
        { id: 40, name: 'Averell' },
        { id: 50, name: 'Ma' }
    ];    
    $scope.selectedDaltons = [40]; // Averell is preselected 
};
于 2014-11-12T18:22:53.007 に答える