根據用戶選擇的值顯示不同的結果

Question

我是angularjs的新手，嘗試學習/找到解決方案，以便用戶可以選擇多個值，然後根據所選值顯示不同的結果。

我做了jsfiddle三個值的三個示例結果在哪裏。

如果用戶選擇名稱1，NAME1和名稱1從下拉菜單然後顯示從DIV類顯示此結果1

而如果值是名稱2，名稱2和NAME2然後顯示從DIV類結果展示 - 結果這2

如何實現這個？

HTML：

<div ng-controller="Main" ng-app> 
    <div>selections = {{selections}}</div> 

    <div> 
     <p>Select values</p> 

     <select ng-model="selections[0]" ng-options="i.id as i.name for i in items"> 
      <option value=""></option> 
     </select> 

     <select ng-model="selections[1]" ng-options="i.id as i.name for i in items"> 
      <option value=""></option> 
     </select> 

     <select ng-model="selections[2]" ng-options="i.id as i.name for i in items"> 
      <option value=""></option> 
     </select> 
    </div> 

    <div class="show-this-1">3x Name1 chosen</div> 
    <div class="show-this-2">3x Name2 chosen</div> 
    <div class="show-this-3">3x Name3 chosen</div> 

</div> 

JS：

function Main($scope) { 

$scope.selections = ["", "", ""]; 

$scope.sample = function() { 
    $scope.selections = [ "id-1", "id-2", "id-3" ]; 
} 

$scope.items = [{ 
    id: 'id-1', 
    name: 'Name 1'}, 
{ 
    id: 'id-2', 
    name: 'Name 2'}, 
{ 
    id: 'id-3', 
    name: 'Name 3'}]; 
} 

jsfiddle Preview

Answer 1

如果你想只有一個取決於3周的div用戶是否選擇了相同的選項，以顯示在所有三個下拉列表中，答案是：

<div ng-controller="Main" ng-app> 
    <div>selections = {{selections}}</div> 

    <div> 
     <p>Select values</p> 

     <select ng-model="selections[0]" ng-options="i.id as i.name for i in items"> 
      <option value=""></option> 
     </select> 

     <select ng-model="selections[1]" ng-options="i.id as i.name for i in items"> 
      <option value=""></option> 
     </select> 

     <select ng-model="selections[2]" ng-options="i.id as i.name for i in items"> 
      <option value=""></option> 
     </select> 
    </div> 

    <div> 
     <div class="show-this-1" ng-show="selections[0] == items[0].id && selections[1] == items[0].id && selections[2] == items[0].id">3x Name1 chosen</div> 
     <div class="show-this-2" ng-show="selections[0] == items[1].id && selections[1] == items[1].id && selections[2] == items[1].id">3x Name2 chosen</div> 
     <div class="show-this-3" ng-show="selections[0] == items[2].id && selections[1] == items[2].id && selections[2] == items[2].id">3x Name3 chosen</div> 
    </div> 

</div> 

jsfiddle