bootstrap-typeahead在ng-grid中不起作用

时间:2013-05-17 12:08:12

标签: angularjs bootstrap-typeahead ng-grid

我正在一个项目中工作,我必须在ng-grid单元格中显示一个预先输入。但是,typeahead在ng网格单元格中不起作用。我放了Plunker

看到预先输入在网格上方的同一页面中工作。但它不适用于ng网格单元。你能帮忙吗?

提前致谢。

2 个答案:

答案 0 :(得分:2)

花了很长时间跟踪你的捡拾器中的所有问题,其中有很多问题:

  • 您在网格单元格中使用的ng-model元素上缺少input指令,控制台中存在许多错误
  • typeahead窗口作为输入元素后面的元素附加,因此它意味着您需要将其包装在父DOM元素中,例如:<div>

以上2项更改使预先工作成功。好吧 - 部分。生成正确的DOM结构等但由于CSS冲突没有显示任何内容。看起来两种类型的弹出窗口和网格中的单元格都是绝对定位的。对于网格来说这有点令人惊讶,但还可以。但真正的问题是,.ngCell类具有overflow: hidden;属性,并且它使得typeahead弹出窗口不可见。

如果您从overflow: hidden;移除.ngCell,则一切都开始“正常”:

http://plnkr.co/edit/pzLb3079yuhDtW1XIxvq?p=preview

我想我们正面临着Bootstrap的CSS和ng-grid CSS的冲突。我们无法在此项目中更改Bootstrap的CSS,因此您必须决定将此问题引起ngGrid人员的注意,或者破解其中一个CSS定义。

答案 1 :(得分:1)