字符串比較指令

不工作，我不知道爲什麼selectedAction == 'Incomplete'部分不能正常工作。該div沒有顯示，但我可以看到{{selectedAction}}在span標籤中顯示「未完成」。字符串比較指令

選擇正確填充。

那裏似乎被前緣和後緣周圍的不完整的文本的空白，當我看在DOM。 actionTypes的JSON只是以下內容，所以我不確定這些空白是從哪裏來的。不知道如果我需要修剪什麼，或者我在這裏忽略什麼。

$scope.actionTypes = [ 
      { "ActionTypeID": 1, "ActionText": "Incomplete" }, 
      { "ActionTypeID": 2, "ActionText": "Complete" } 
    ]; 

<select class="form-control form-small-auto" style="width:100%" data-ng-model="selectedAction"> 
      <option data-ng-repeat="action in actionTypes"> 
       {{action.ActionText}} 
      </option> 
</select> 

<span> 
    {{selectedAction}} --- this shows 'Incomplete' 
</span> 

'This div is not showing 
<div style="padding-top: 5px;" data-ng-show="selectedAction == 'Incomplete'"> 

</div>

的jsfiddle：http://jsfiddle.net/0qmtkLh5/3/

來源

2014-09-23 maxedev

護理上傳的jsfiddle示例 – 2014-09-23 12:46:10

'selectedAction'節目''Incomplete''包括單引號？ – 2014-09-23 12:47:18

不包括引號。只是不完整，前後有一堆空白 – maxedev 2014-09-23 12:48:55

您需要定義從<option>標籤value屬性，否則瀏覽器將使用該標籤作爲價值的內容，而在這種情況下，內容將包括空格和斷線（\n）。這就是文字不匹配的原因。

<option data-ng-repeat="action in actionTypes" value="{{action.ActionText}}"> 
    {{action.ActionText}} 
</option>

plunker

來源

2014-09-23 13:03:27 bmleite

ahhh謝謝！ – maxedev 2014-09-23 13:05:24

@maxedev必須聲明'value'屬性的原因是使用錯誤的指令'ng-repeat'。你需要使用'ng-options'指令。請參閱@Plantface答案。 – 2014-09-23 13:09:48

您可以通過使用ng-options，而不是在<option>的ng-repeat解決這個問題，讓AngularJs自動管理<option>值和標籤：

<select style="width:100%" data-ng-model="selectedAction" ng-options="action.ActionText as action.ActionText for action in actionTypes">

jsFiddle

就個人而言，我寧願選擇所述整個對象，而不是用來表示它的標籤：

<select style="width:100%" data-ng-model="selectedAction" ng-options="action as action.ActionText for action in actionTypes"> 
... 
{{selectedAction.ActionText}} 
... 
<div data-ng-show="selectedAction.ActionText == 'Incomplete'">

jsFiddle

來源

2014-09-23 13:06:22

字符串比較指令

回答

相關問題