Angular JS选择手动选项

nic*_*art 7 javascript angularjs

我们的app中有一些下拉菜单,我们不能使用ng-options,因为我们需要在<options>标签本身设置title属性,这是ng-options无法实现的.

我们需要标题的原因是因为IE <9砍掉了长的值,它们仅在标题中可见(在元素悬停时显示)

现在,要看到这个问题我正在看下面的JS小提琴.

http://jsfiddle.net/nstuart/nF7eJ/(HTML Bit)

<div ng-app="myApp" ng-controller="MyCtrl">
    <select ng-model="params.value">
        <option value="">Any</option>
        <option ng-repeat="v in options" value="{{v.value}}" title="{{v.name}}" ng-selected="{{v.value == params.value}}">{{v.name}}</option>
    </select>
    <p>{{params.value}}</p>
</div>
Run Code Online (Sandbox Code Playgroud)

理想情况下,select选择 'test3',但你可以看到它被设置为一个空选项.我理解这是因为ng-options中没有ng-model的值,但那是因为我没有定义一个!

关于如何使这样的工作的任何想法?甚至可以为ng-options生成的选项添加标题,以便我们可以使用它?

编辑

更新了小提琴:http://jsfiddle.net/nstuart/nBphn/2/,如下面的答案中所述.

sat*_*run 16

实际上,只需从ng-selected中的表达式中删除花括号,它就可以工作:

<option ng-repeat="v in options" 
        value="{{v.value}}" 
        title="{{v.name}}" 
        ng-selected="v.value == params.value">{{v.name}}
</option>
Run Code Online (Sandbox Code Playgroud)

小提琴