AngularJS:ng-selected 不显示选定的值

IT技术 javascript angularjs
2021-01-24 03:58:56

至于标题,我的选择似乎无法显示所选值,例如,正确选择...

<md-input-container flex>
    <label>Anno selezione</label>
    <md-select name="annoSelect" ng-model="vm.anno_attuale"
               ng-value="vm.progetto.pprs[$index].anno"
               ng-selected="item.selected" >
         <md-option ng-repeat="item in vm.progetto.pprs" >
           {{vm.progetto.pprs[$index].anno}}
         </md-option>
    </md-select> 
</md-input-container>

我尝试了一些在堆栈上找到的解决方案,例如: Angular : ng-select does not show ng-selected value

但他们中的任何一个都没有解决问题......知道吗?

2个回答

从文档:

注意:ngSelected不与selectandngModel指令交互,它只selected在元素上设置属性。如果您ngModel在选择上使用,则不应ngSelected在选项上使用,因为ngModel会设置选择值和选择的选项。

— AngularJS ng-selected Directive API 参考

ng-value指令位于错误的位置:

<md-input-container flex>
    <label>Anno selezione</label>
    <md-select name="annoSelect" ng-model="vm.anno_attuale"
               ̶n̶g̶-̶v̶a̶l̶u̶e̶=̶"̶v̶m̶.̶p̶r̶o̶g̶e̶t̶t̶o̶.̶p̶p̶r̶s̶[̶$̶i̶n̶d̶e̶x̶]̶.̶a̶n̶n̶o̶"̶                 
               ̶n̶g̶-̶s̶e̶l̶e̶c̶t̶e̶d̶=̶"̶i̶t̶e̶m̶.̶s̶e̶l̶e̶c̶t̶e̶d̶"̶ ̶  >
         <md-option ng-repeat="item in vm.progetto.pprs" 
                    ng-value="item.anno">
           ̶{̶{̶v̶m̶.̶p̶r̶o̶g̶e̶t̶t̶o̶.̶p̶p̶r̶s̶[̶$̶i̶n̶d̶e̶x̶]̶.̶a̶n̶n̶o̶}̶}̶
           {{item.anno}}
         </md-option>
    </md-select> 
</md-input-container>

有关详细信息,请参阅使用ngValue到模型绑定到对象的数组

OOOOH yesss... 你是一个真正的魔术师!
2021-04-01 03:58:56

您需要将 Theng-selected<select>元素移动<option>元素

ng-selected 指令设置列表中<option>元素的 selected 属性<select>

ng-selected - AngularJS 文档

在您的特定情况下,您的代码中出现的问题似乎不止一个。ng-valueng-selected指令属于<md-options>元素。另外你需要选择一种策略,如果你使用ng-model,并ng-value那么你不应该使用ng-selected

您的代码应如下所示:

<md-input-container flex>
<label>Anno selezione</label>
<md-select name="annoSelect" ng-model="vm.anno_attuale">
<md-option ng-repeat="item in vm.progetto.pprs" ng-value="vm.progetto.pprs[$index].anno">{{vm.progetto.pprs[$index].anno}}</md-option>
</md-select>
</md-input-container>

此外,我会仔细检查您的ng-modelng-value确保您获得了您认为的value。在此处查看官方AngularJS Material mdSelect Docs有一个例子与你的非常相似。它应该可以帮助您上路!

谢谢!听起来不错……但似乎不起作用,无论如何……也许 tem.selected 是注意我的 ng-selected 的正确值?
2021-04-01 03:58:56
请参阅更新的答案,@Miss-Take。
2021-04-07 03:58:56