Angular ng-if inside选项元素和ng-repeat不起作用

I have select element which should list available currencies. Default currency should have prefix "Default" before its name. For some reason, that prefix is showing for all currencies in the list.

我有选择元素，应该列出可用的货币。默认货币在其名称前应具有前缀“Default”。出于某种原因，该前缀显示在列表中的所有货币。

Test HTML:

测试HTML：

<div ng-app="testApp">
  <div ng-controller="MainCtrl">
     <select>
        <option ng-repeat="rate in rates track by $index">
            <span ng-if="rate.is_default">Default</span>
            <span>{{rate.name}}</span>
        </option>
     </select>
  </div>
</div>

TEST JS:

测试JS：

var app = angular.module("testApp", []);

app.controller("MainCtrl", function($scope){

$scope.rates = [
    { 'name': 'dolar', 'is_default': true},
    { 'name': 'pound', 'is_default': false},
    { 'name': 'euro', 'is_default': false}
];

});

jsFiddle

的jsfiddle

1 个解决方案

#1

You can't use HTML tags in an option tag but you can do something like this:

您不能在选项标记中使用HTML标记，但您可以执行以下操作：

<option ng-repeat="rate in rates track by $index">
    {{ rate.is_default ? 'default' : '' }} {{rate.name}}
</option>

Fiddle