我有模态形式，我想在我的模态形式中使用自动重现字段。
为实现这一目标，我使用的是来自md-autocomplete的{{1}}，它提供了这样的功能并且易于使用。
问题是当我在这个字段中写一些东西时，整个建议列表出现在我的模态窗口后面，但它应该出现在这个模态窗体的顶部。
你知道如何解决这个问题吗？
我附加了表单源和相关角度控制器的html代码。
angular-material#1.1.0
movie-resource-dialog-controller.js (function() {
'use strict';
angular
.module('vodApp')
.controller('MovieResourceDialogController', MovieResourceDialogController);
MovieResourceDialogController.$inject = ['$http', '$timeout', '$scope', '$stateParams', '$uibModalInstance', 'DataUtils', 'entity', 'MovieResource', 'Movie'];
function MovieResourceDialogController ($http, $timeout, $scope, $stateParams, $uibModalInstance, DataUtils, entity, MovieResource, Movie) {
var vm = this;
vm.movieResource = entity;
vm.clear = clear;
vm.byteSize = DataUtils.byteSize;
vm.openFile = DataUtils.openFile;
vm.save = save;
$timeout(function (){
angular.element('.form-group:eq(1)>input').focus();
});
function clear () {
$uibModalInstance.dismiss('cancel');
}
function save () {
vm.isSaving = true;
if (vm.movieResource.id !== null) {
MovieResource.update(vm.movieResource, onSaveSuccess, onSaveError);
} else {
MovieResource.save(vm.movieResource, onSaveSuccess, onSaveError);
}
}
function onSaveSuccess (result) {
$scope.$emit('vodApp:movieResourceUpdate', result);
$uibModalInstance.close(result);
vm.isSaving = false;
}
function onSaveError () {
vm.isSaving = false;
}
vm.setResource = function ($file, movieResource) {
if ($file && $file.$error === 'pattern') {
return;
}
if ($file) {
DataUtils.toBase64($file, function(base64Data) {
$scope.$apply(function() {
movieResource.resource = base64Data;
movieResource.resourceContentType = $file.type;
});
});
}
};
vm.querySearchMoviesLike = function (query) {
Movie.queryByTitle({
title: query
}, onSuccess, onError);
function onSuccess(data, headers) {
vm.proposedMovies = data;
}
function onError(error) {
AlertService.error(error.data.message);
}
return vm.proposedMovies;
}
}
})();
movie-resource-dialog.html屏幕截图（看起来像这样）： https://i.stack.imgur.com/P6Ln3.png
谢谢你，卢克
答案 0 :(得分：9)
您需要覆盖模态z-index css属性。将此css样式添加到现有样式表或页面md-autocomplete-suggestions-container
.md-autocomplete-suggestions-container{
z-index:100000 !important; /* any number of choice > 1050*/
}
答案 1 :(得分：1)
我有几乎相同的问题，但在我的情况下我的列表是不可选择的，我的问题是因为当模态打开时它有一个通用的“指针 - 事件：无”所以我在我的全局CSS上添加下面的CSS它解决了我的问题。希望它可以帮助别人。
.md-autocomplete-suggestions-container{
pointer-events: all !important;
}
答案 2 :(得分：0)
对于仍在寻找它的任何人，我发现这项工作对我有用
/deep/ .cdk-overlay-container { z-index: 9999; }