javascript - 如何使用 Angular js选择动态选择选项值

Question

<select  class="select" data-ng-model="sites.webSites.addable.languages"
ng-options="language as language.label for language in languages" >
                                                    </select>

$scope.languages = [
             {
                 value : 'lang_en',
                 label : 'English-en'
             },
             {
                 value : 'lang_es',
                 label : 'Spanish-es'
             },
             ];

单击按钮我必须选择该项目

我已经尝试过这样的

var sitevalue = 'lang_es'//dynamic

$('.select').val(sitevalue);

但它不起作用，请提出建议。

Answer 1

将您的选择更改为如下所示:

<select data-ng-model="sites.language"
    ng-options="language.value as language.label for language in languages" ></select>

那么这应该可以在您的 Controller 中工作:

sites.language = 'lang_es'

这是一个工作 jsfiddle

更新:

当你写language as language.label for ...时你告诉 Angular 去映射 ng-model反对像 { value : '...', label : '...' } 。这将根据引用进行跟踪，这意味着您必须向 ng-model 分配与您指定的完全相同的实例。这是jsfiddle来自 Angular 团队的说明。

您可以使用简单的值属性赋值来通过在 ng-options 中使用此值来更改所选值: language.value as language.label for ...

并且您不想编写 jquery 选择器或操作 DOM，请尝试避免 $('.select').val(sitevalue);当使用 Angular 时。使用原生 js-models 来代替，并依靠框架来完成剩下的工作。