bootstrap-typeahead не работает в ng-grid

Я работаю над проектом, где мне нужно показать тип в ячейке ng-grid. Но ввод текста не работает в ячейке сетки ng. Я установил планкер.

Обратите внимание, что шрифт работает на той же странице над сеткой. Но это не работает в ячейке сетки ng. Не могли бы вы помочь?

Заранее спасибо.


angularjs bootstrap-typeahead ng-grid
person Arnab Das    schedule 17.05.2013    source источник
comment
Кажется, вы также открыли проблему в репозитории Bootstrap, я прокомментировал проблему: github.com/angular-ui/bootstrap/issues/444   -  person pkozlowski.opensource    schedule 17.05.2013

Ответы (2)


arrow_upward
2
arrow_downward

Потратил довольно много времени на отслеживание всех проблем в вашем плункере, их было довольно много:

  • вы пропустили директиву ng-model для элементов input, используемых в ячейке сетки, в консоли было много ошибок
  • Окно typeahead добавляется как элемент после элемента ввода, поэтому это означает, что вам нужно обернуть его в родительский элемент DOM, например: <div>

2 вышеперечисленных изменения заставили шрифт работать. Ну - частично. Генерируется правильная структура DOM и т. д., но ничего не отображается из-за конфликтов CSS. Кажется, что и всплывающее окно, и ячейка в сетке абсолютно позиционированы. Это немного неожиданно для сетки, но ок. Настоящая проблема, однако, заключается в том, что класс .ngCell имеет свойство overflow: hidden;, и это делает всплывающее окно невидимым.

Если вы удалите overflow: hidden; из .ngCell, все начнет «работать»:

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

Я предполагаю, что мы сталкиваемся с конфликтами CSS Bootstrap и CSS ng-grid. Мы не можем изменить CSS Bootstrap в этом проекте, поэтому вам придется либо довести эту проблему до сведения разработчиков ngGrid, либо взломать одно из определений CSS.

person pkozlowski.opensource    schedule 17.05.2013
comment
Большое спасибо @pkozlowski.opensource. Вероятно, это было совершенно новое требование относительно ng-grid и bootstrap-typeahead. На самом деле я новичок в AngularJs. Итак, ошибка была допущена. Еще раз спасибо за ваше время. - person Arnab Das; 18.05.2013

arrow_upward
1
arrow_downward

Дополнительная информация о том, как заставить работать встроенное редактирование ng-grid + typeahead:

http://lemoncode.net/2014/01/28/ng-grid-inline-editing-using-bootstrap-typeahead/

планкр:

http://plnkr.co/edit/8udsvZSokG5v37xicyuz?p=info

person Braulio    schedule 11.05.2014