顯示/隱藏div取決於在AngularJS中的下拉列表選擇

Question

我想顯示一個div，具體取決於從下拉列表中選擇的內容。例如，如果從列表中顯示的現金股利或如果用戶的用戶選擇「現金」從列表中選擇顯示檢測格「查詢」

我已經把樣本，但它的不完整，需要線了

http://jsfiddle.net/abuhamzah/nq1eyj1v/

而且當用戶更改選擇我也想清除以前的選擇，所以當用戶回到以前的選擇，他們不應該看到。

<div ng-controller="MyCtrl"> 
    <div class="col-xs-12"> 
     <label class="col-xs-6 control-label">Type:</label> 
     <div class="col-xs-6"> 
     <select name="type" ng-model="payment.type" ng-dropdown required ng-change="changeme()" > 
      <option ng-option value="Cash">Cash</option> 
      <option ng-option value="Check">Check</option> 
      <option ng-option value="Money Order">Money Order</option> 
     </select> 
     </div> 
    </div> 
    <div class="col-xs-12" id="cash"> 
     <div > 
     <label class="col-xs-6 control-label">Cash :</label> 
     <div class="col-xs-6"> 
      <input type="number" class="form-control" ng-model="payment.cash" /> 
     </div> 
     </div> 
    </div> 

    <div class="col-xs-12" id="check"> 
     <div > 
     <label class="col-xs-6 control-label">check :</label> 
     <div class="col-xs-6"> 
      <input type="number" class="form-control" ng-model="payment.check" /> 
     </div> 
     </div> 
    </div> 

    <div class="col-xs-12" id="money_order"> 
     <div > 
     <label class="col-xs-6 control-label">money_order :</label> 
     <div class="col-xs-6"> 
      <input type="number" class="form-control" ng-model="payment.money_order" /> 
     </div> 
     </div> 
    </div> 

</div> 

//控制器：

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


function MyCtrl($scope) { 

    $scope.changeme = function() { 
    alert('here'); 
    } 
} 

Answer 1

你沒有初始化爲angular app怎麼把ü錯過了ng-app指令第一

，這是使用該解決方案ng-if

DEMO

<div ng-app="myApp" ng-controller="MyCtrl"> // initialize as a angular app 

<div class="col-xs-12" id="cash" ng-if="payment.type == 'Cash'"> // this div will show if the value of `payment.type` model equals to `cash`. and so on.