2016-07-25 15 views
1

ServiceTypeのドロップダウン選択値に基づいて適切なServiceNameドロップダウン値を設定するにはどうすればよいですか。私は、最初のオブジェクト「対面」の値をロードする場合、例えば、最初のドロップダウン値「コミュニティ機能評価」に選択されるべきであるServiceTypeに値を設定できますが、ServiceNameに適切な値を取得できません(依存ドロップダウンリスト)

$scope.ServiceTypeAndName = [  
 
    { 
 
     "id":0, 
 
     "type":"", 
 
     "list":"" 
 
    }, 
 
    { 
 
     "id":1, 
 
     "type":"In-Person", 
 
     "list":["ADL Functional Assessment", "Community Functional Assessment", "Future Care Cost Analysis"] 
 
    }, 
 
    { 
 
     "id":2, 
 
     "type":"Paper Review", 
 
     "list":["OT - In Home Assessment - ABI", "OT - In Home Assessment Attendant Care with Form 1", "OT - Occupational Therapy Assessment"] 
 
      
 
    }, 
 
    { 
 
     "id":3, 
 
     "type":"Administration", 
 
     "list":["Situational Assessment", "Situational Assessment (OT) - Day 1", "Situational Assessment (OT) - Day 2", "Construction Cost Consulting"] 
 
    } 
 
]; 
 

 

 
$scope.selectedLine = [{"Event_ID": "100", "Service_Type": "In-Person", "Service_Name": "Community Functional Assessment"}, {"Event_ID": "101", "Service_Type": "Paper Review", "Service_Name": "OT - Occupational Therapy Assessment"},{"Event_ID": "102", "Service_Type": "In-Person", "Service_Name": "Future Care Cost Analysis"}];
<select ng-model="selectedLine.Service_Type" name="ServiceType" class="form-control"> 
 
    <option ng-repeat="temp in ServiceTypeAndName" value="{{temp.type}}">{{temp.type}}</option> 
 
</select> 
 
\t \t \t \t \t \t \t \t \t \t 
 
<select ng-model="selectedLine.Service_Name" name="ServiceName" ng-required="selectedLine.Service_Type!=''" class="form-control"> 
 
    
 
</select>

のに選択されるべきです2番目のドロップダウンとそれに対応するリスト値が表示されます。最初のドロップダウンを変更すると、対応するリスト値が2番目のドロップダウンに表示されます。

+0

最後の段落を明確にしたい場合があります。あなたの目的が何であるかを理解することは難しいです。また、selectedLine.ServiceNameListの 'ng-repeat =" temp "という行は、' selectedLine'には存在しないプロパティ 'ServiceNameList'を参照します。この場合、 'selectedLine'は配列です。 – KreepN

+0

私は段落と私の2番目の選択HTMLを更新しました。 –

答えて

1

あなたのデータは、この最も簡単なことはない方法で構造が、それはまだ最悪ではありません。

あなたが ServiceTypeAndName配列あなたにどのオブジェクトを見つけるために必要な基本的

Working Plnkr

が一致しています。これは、フィルタを必要とします。

$scope.selectedLineChanged = function() {     
    $scope.SelectedServiceTypeAndName = $filter('filter')($scope.ServiceTypeAndName, $scope.selectedLine.Service_Type)[0];   
}; 

は、ここでのことだ:私はあなたの選択した項目、あなたがselectedLines配列に格納したものをロードすることを計画かわかりません。その項目をplnkrの選択ボックスで読み込みます。

トップボックスを変更すると、残りの2つが一致します。

enter image description here

+0

ありがとうございます。できます。簡単にするために私の構造の変更を提案しますか? –

+0

@ KarimAliあなたがデータ構造を管理していたかどうかは確かではありませんでした。そのため、私はその範囲内で作業していました。それを見直した後、あなたは 'ServiceTypeAndName'の中のマッチを追跡するオブジェクトを私が紹介している限り、あなたのデータ構造は良く見えます。 – KreepN

関連する問題