angularjs – 如何在角度中正确使用ng重复？

发布时间：2020-12-17 07:15:17 所属栏目：安全来源：网络整理

导读：我有一个旧的代码为角形的形式包含这些行： label for="language"{{'LANGUAGE_LABEL' | translate}}/label select id="language" name="language" ng-model="paramsGEN.lan.paramUserValue" option value="en"{{'referencedata.languages.EN' | translate}}/

我有一个旧的代码为角形的形式包含这些行：

<label for="language">{{'LANGUAGE_LABEL' | translate}}</label>
      <select id="language" name="language" ng-model="paramsGEN.lan.paramUserValue">
      <option value="en">{{'referencedata.languages.EN' | translate}}</option>
      <option value="nl">{{'referencedata.languages.NL' | translate}}</option>
      </select>

我想通过使用ng repeat来优化它(我已经读过ng选项更好但我以前从未使用过…)

所以,在我的控制器中,我添加了一个新变量：

$scope.languages = [{
      name: "referencedata.languages.EN",value: "en"
    },{
      name: "referencedata.languages.NL",value: "nl"
    }]

这是我使用ng重复的代码：

<select id="language" name="language" ng-model="paramsGEN.lan.paramUserValue">
<option ng-repeat="language in languages track by value" value="{{language.value}}">
{{language.name | translate}}
</option>

但它根本不起作用,我得到了“错误：[ngRepeat：dupes]”.

你能告诉我,我怎么能在这里使用ng重复？或ng选项,如果可以,如果它更优化ng重复.
谢谢！！

解决方法

您按值跟踪但未定义.它应该是language.value.

<option ng-repeat="language in languages track by language.value" value="{{language.value}}">

您可以在下面找到ng-options版本：

<select id="language" name="language" ng-model="paramsGEN.lan.paramUserValue"
        ng-options="language.name for language in languages track by language.value">
</select>

以及两个示例的工作代码段：

function Main($scope) {
  $scope.languages = [{
      name: "referencedata.languages.EN",value: "nl"
    }];
}

angular.module('test',[]);
angular.module('test')
  .controller('Main',Main);

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.js"></script>
<div ng-app="test">
  <div ng-controller="Main">
    <label for="language">{{'LANGUAGE_LABEL'}}</label>
    <select id="language" name="language" ng-model="paramsGEN.lan.paramUserValue">
      <option ng-repeat="language in languages track by language.value" value="{{language.value}}">
        {{language.name}}
      </option>
    </select>
    <hr>
    <select id="language" name="language" ng-model="paramsGEN.lan.paramUserValue"
            ng-options="language.name for language in languages track by language.value">
    </select>
  </div>
</div>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!