javascript - AngularJS-ng选项

我有一个使用经销商对象数组的选择。我可以选择显示经销商名称，但是我也想显示距离。例如“经销商名称-12英里”。

我的选择：

<select ng-show="dealers" ng-model="formData.dealer.dealerNumber"
ng-options="dealer.dealerNumber as dealer.name for dealer in dealers">
</select>

最佳答案

在doc中：


  选择作为数组中值的标签
  
  label：此表达式的结果将是元素的标签。该表达式很可能会引用值变量（例如value.propertyName）。

angular.module('app', [])
  .controller('ctrl', ["$scope",
    function($scope) {
      $scope.dealers = [{
          dealerNumber: 1,
          name: 'd',
          distance: '123'
        }, {
          dealerNumber: 2,
          name: 'dd',
          distance: '124'
        }, {
          dealerNumber: 3,
          name: 'ddd',
          distance: '125'
        }, {
          dealerNumber: 4,
          name: 'dddd',
          distance: '126'
        }, {
          dealerNumber: 5,
          name: 'ddddd',
          distance: '127'
        }, {
          dealerNumber: 6,
          name: 'dddddd',
          distance: '128'
        }


      ];

    }
  ]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
  <select ng-show="dealers" ng-model="dealerNumber" ng-options="dealer.dealerNumber as dealer.name+'-'+dealer.distance for dealer in dealers">
  </select>
</div>

更新：使用过滤器

angular.module('app', [])
  .controller('ctrl', ["$scope",
    function($scope) {
      $scope.dealers = [{
          dealerNumber: 1,
          name: 'd',
          distance: '123.5'
        }, {
          dealerNumber: 2,
          name: 'dd',
          distance: '124.6'
        }, {
          dealerNumber: 3,
          name: 'ddd',
          distance: '125'
        }, {
          dealerNumber: 4,
          name: 'dddd',
          distance: '126'
        }, {
          dealerNumber: 5,
          name: 'ddddd',
          distance: '127'
        }, {
          dealerNumber: 6,
          name: 'dddddd',
          distance: '128'
        }


      ];

    }
  ]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
  <select ng-show="dealers" ng-model="dealerNumber" ng-options="dealer.dealerNumber as dealer.name+'-'+(dealer.distance|number:0) for dealer in dealers">
  </select>
</div>

关于javascript - AngularJS-ng选项，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/29790862/