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>

然后这应该在您的控制器内部工作：

sites.language = 'lang_es'

这是一个有效的jsfiddle

<强>更新

当您撰写language as language.label for ...时，您正在指出将ng-model映射到像{ value : '...', label : '...' }这样的对象的角度。每个引用将跟踪哪个，意味着您必须将ng-model分配给您指定的相同实例。以下是来自角度团队的jsfiddle来说明这一点。

您可以使用简单的分配来估算值，以便使用内部ng-options来标记所选值：language.value as language.label for ...

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

Answer 2

您的模型应设置为您想要选择的确切对象（通过引用），而不仅仅是值。

让你像这样的HTML：

  <body ng-controller="TestCtrl">
    <select  class="select" ng-options=" language.label for language in languages" ng-model="selectedValue"></select>
    <button ng-click="selectedValue = defaultValue">Select Default</button>
  </body>

你的控制器是这样的：

function TestCtrl($scope) {
  $scope.languages = [
   {
       value : 'lang_en',
       label : 'English-en'
   },
   {
       value : 'lang_es',
       label : 'Spanish-es'
   },
   ];
   $scope.selectedValue = {};
   $scope.defaultValue = $scope.languages[1];
}

这将完成这项工作。工作人员：http://plnkr.co/edit/8HrQUGMx4jGmJv3fbdDq?p=preview

Answer 3

$scope.sites.webSites.addable.languages = 'lang_es';

所选值与data-ng-model

如何使用角度js选择动态选择选项值

4 个答案: