时间戳

首页 > 解决方案 > 与在 ng-options 中使用 Select 的区别

angularjs - 与在 ng-options 中使用 Select 的区别

问题描述

IE 中的选择框在第一次使用时会导致打开问题 identity as identity.identityName for identity in identityProofList track by identity.identityIdorng-repeat 但当不使用时identity as，它工作正常，也看不出选择框的功能有任何差异。

<select name="identityProof" ng-model="identityProof" ng-change="changeProofOfIdentity(identityProof)" ng-options="identity.identityName for identity in identityProofList track by identity.identityId"  id="identityProofList" >

其中identityProofList 是具有属性identityName 和identityId 的对象数组。

  1. 两者有什么区别？

  2. 为什么ng-repeat会导致 IE11 出现问题。

标签： angularjsinternet-explorer-11angularjs-ng-options

解决方案

两者有什么区别？

你的意思是ng-repeat和ng-options之间的区别吗？

使用它们创建 DropdownList 的区别在于：

使用 ng-options 制作的下拉菜单允许选择的值是一个对象，而使用 ng-repeat 制作的下拉菜单必须是一个字符串。

更多详细信息，请查看AngularJS 选择框。

为什么 ng-repeat 导致 IE11 出现问题也与使用 .

根据您的代码，我使用以下代码创建了一个示例，它在我的 IE 浏览器（11.17134.1.0）上运行良好，您可以参考。

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
    <p>Select a identity:</p>
    <select ng-model="selectedidentity">
        <option ng-repeat="x in identityProofList " value="{{x.identityId}}">{{x.identityName}}</option>
    </select>
    <h1>You selected: {{selectedidentity}}</h1><br />

    <select name="identityProof" ng-model="identityProof" ng-change="changeProofOfIdentity(identityProof)"
            ng-options="identity as identity.identityName for identity in identityProofList track by identity.identityId"
            id="identityProofList"></select>
    <h1>You selected: {{selectedvalue}}</h1>
</div>
<script>
    var app = angular.module('myApp', []);
    app.controller('myCtrl', function ($scope) {
        $scope.identityProofList = [
            { identityId: "1001", identityName: "Admin" },
            { identityId: "1002", identityName: "User" },
            { identityId: "1003", identityName: "Customer" }
        ];
        $scope.selectedvalue = "";
        $scope.changeProofOfIdentity = function (identity) {
            $scope.selectedvalue = identity.identityName;
        }
    });
</script>

结果是这样的。

推荐阅读