Question

我有一个包含这些数据的角度下拉列表：

.constant('colors', {
   1 : red,
   2 : blue,
   3 : yellow
})

我有一个下拉列表，如下所示：

 ng-options="key as key for (key, value) in colors"

此选择位于模态窗口中。它工作正常，因此所选值在模型中正确表示。

但是，当我重新打开模态窗口时，下拉列表始终默认为默认值，忽略以前选择的值。

有人可以帮我解决这个问题吗？

此外，是否可以在下拉列表中同时显示键和值？因此，而不是下拉，如：1,2,3，我想要像1 - 红色，2 - 蓝色，3 - 黄色的东西。另外，我不想只显示颜色名称，因为我需要数字。

先谢谢你们！

Answer 1

当你打开模态时，它应该作为一个设置为变量的函数完成，然后你可以在模态关闭后调用它。您还需要使用$ modalInstance将选择传递回控制器。

由于您没有提供整个控制器，下面是您需要做的样本。

查看有效的Plunker

angular.module('myApp', ['ui.bootstrap']);

angular.module('myApp').controller('MyController', function ($scope, $modal) {

  $scope.colors = {
     1 : 'red',
     2 : 'blue',
     3 : 'yellow'
  }

  $scope.selection = "";

  $scope.openModal = function () {

    var modalInstance = $modal.open({
      templateUrl: 'myModalContent.html',
      controller: 'modalController',
      size: 'sm',
      resolve: {
        selection: function () {
          return $scope.selection;
        },
        colors: function () {
          return $scope.colors;
        }
      }
    });

    modalInstance.result.then(function (selection) {
      $scope.selection = selection;
    })
  };
});


angular.module('myApp').controller('modalController', function ($scope, $modalInstance, selection, colors) {

  $scope.colors = colors;
  $scope.selection = selection;

  $scope.ok = function () {
    $modalInstance.close($scope.selection);
  };

  $scope.cancel = function () {
    $modalInstance.dismiss('cancel');
  };
});

正如皮埃尔所提到的，将你的选项设置为：ng-options="key as (key + ' - ' + value) for (key, value) in colors"以将颜色名称添加到标签

角度下拉列表始终默认为默认值

1 个答案: