0

私はAngular-Select2を使用していますが、実際に必要なのは、現在選択されているオプションの名前よりも多くの値を収集する変更です。たとえば、オプションRed、Blue、Yellowが選択されている場合、現在の値はそれらの値の配列です。私がやりたいことは、選択されたすべての (この例では) 色を選択ボックスの下に表示することです。これまでのところ機能しています-「色」が表示されており、選択ボックスから1つを削除すると（X記号をクリックしてタグとして）、それに応じて下部が更新されます。

さらに達成する必要があるのは、データベースにクエリを実行できるように、他の値、または少なくとも 1 つの (id) を送信することです。実際の名前の前に含めてから、リストから削除して個別に操作できるようにすることもできますが、ID はドロップダウン リストと選択したオプション内にも表示されます。

どうやって進める？オプションに添付され、選択されたオプションのテキストが表示される以下の領域内で送信および読み取り可能なものはありますか?

私は次のような変更を監視しています：

$scope.$watch('selectDiseaseState', function(newVal){
    $scope.listDiagnosis = newVal;
});

編集: 混乱している場合 - これは複数選択ドロップダウンです。編集：

select2 マークアップ:

<select id="mySel2" ng-model="selectDiseaseState" class="form-control" multiple="multiple" placeholder="Start typing a name of disease state...">
    <optgroup ng-repeat="item in select" label="{{item.label}}">
        <option ng-repeat="option in item.options">{{option.value}}</option>
    </optgroup>
</select>
4

1 に答える 1

0

単純な配列ではなく、オブジェクトの配列を使用ng-modelしてバインディングにバインドする必要があります。ng-optionsその後、ドロップダウンで変更を監視できます。新しい値は、すべてのプロパティを含むオブジェクトになります。 HTML

<div ng-app='app' ng-controller='controller'>
    <select ng-model='selectDiseaseState' ng-options='item as item.Color for item in selectOptions'> 
    </select>
</div>

Angular コード: var app= angular.module('app', []) .controller('controller', function($scope){

$scope.selectOptions = [
    {Id: 1, Color: 'Red'},
    {Id: 2, Color: 'Blue'},
    {Id: 3, Color: 'Green'},
    {Id: 4, Color: 'Yellow'}
];
$scope.selectDiseaseState = {};

$scope.$watch('selectDiseaseState', function(newVal){
    $scope.listDiagnosis = newVal;
    alert('Id: '+ $scope.listDiagnosis.Id + ' and Color: '+ $scope.listDiagnosis.Color);
});

});

デモ

于 2014-08-29T18:01:55.037 に答える