ng-options和ng-switch一起使用時出現的問題

當我嘗試在AngularJS中一起使用ng-options和ng-switch來動態更改爲widget構建器在頁面上放置的內容時，我遇到問題工作。

ng-options和ng-switch一起使用時出現的問題

我有兩個問題，我遇到：
1.我似乎無法設置NG-選項默認值被從它顯示的JSON模式設置。
2.當我更改ng選項字段時，下面的開關斷開，不再顯示正確的代碼。

下面是代碼：

<div ng-app=""> 
    <div data-ng-controller="SimpleController"> 
    Type: <select ng-model="config.type" ng-options="inputTypes.option for inputTypes in dropDownOptions"></select><br/> 
    Source/Content: <input type="text" ng-model="config.content" /><br/> 
    <br/> 
    <div ng-switch on="config.type"> 
     <img ng-switch-when="image" ng-src="{{config.content}}"> 
     <div ng-switch-when="text" >{{config.content}}</div> 
    </div> 
    </div> 
</div> 
<script> 
    function SimpleController($scope) { 
    $scope.dropDownOptions = [ 
    {"option": "image"}, 
    {"option": "text"} 
]; 
$scope.config = { 
    "type":"text", 
    "content":"Hello" 
}; 
    } 
</script>

，這裏是一個鏈接到的jsfiddle運行它http://jsfiddle.net/jpeak/dkvwa/

來源

2013-07-19 MrCrowly

的問題是，當您使用NG-選項，並選擇一個項目，它選擇整個對象，即使只有您指定的單個鍵出現在選擇中。所以當你選擇「text」時，$ scope.config.type被設置爲{'option'：'text'}而不僅僅是「text」。

來源

2013-07-19 21:44:34 Sharondio

這是有道理的，但你會如何解決這個問題，使其設置正確？關於問題1的任何想法？謝謝您的幫助。 – MrCrowly

當我將$ scope.dropDownOptions更改爲一個簡單的列表而不是對象時，它對我有用：http://jsfiddle.net/wKzZA/3/ – Sharondio

完美地感謝您的幫助。 – MrCrowly

ng-options和ng-switch一起使用時出現的問題

回答

相關問題