Как мне заставить модалы работать так же, как раньше?

#angularjs #twitter-bootstrap

#angularjs #twitter-bootstrap

Вопрос:

Я только что вытащил некоторый код, над которым работал несколько месяцев назад, используя angular и bootstrap или, более конкретно, который использует модалы. По-видимому, модалы сильно изменились.

Мой код:

         <div class="modal" ng-show="isDocPopupVisible">
            <div class="modal-header">
                <button type="button" class="close" ng-click="closeDocPopup()">×</button>
                <h3>{{selectedDoc.name}}</h3>
            </div>
            <div class="modal-body">
                <strong>Created Date:</strong> {{selectedDoc.date}} <br />
                <br />
                <p>
                    <span style="white-space:pre">{{selectedDoc.description}}</span>
                </p>
            </div>
            <div class="modal-footer">
                <a href="{{selectedDoc.href}}" class="btn btn-primary" ng-click="closeDocPopup()">Download</a>
                <a href="#" class="btn btn" ng-click="closeDocPopup()">Close</a>

            </div>
        </div>
  

Больше ничего не происходит, когда я нажимаю документ. Если я изменю класс с модального на modal-dialog, нижняя часть скользит вниз, но я больше не могу сделать его всплывающим модальным. Просмотр документов bootstrap делает его намного более интенсивным, чем раньше, и я думаю, это нормально, но я просто надеюсь, что это что-то похожее на btn btn, переключенный на btn btn-primary.

Любая помощь — спасибо всем.

Комментарии:

1. См getbootstrap.com/migration/#notes

Ответ №1:

но я понял это, просто нужно было кое-что изменить.

                    <tr ng-repeat="doc in docs.cast | orderBy:'name' | filter:search" data-toggle="modal" data-target="#docModal" ng-click="showDocPopup(doc)">
                        <td>{{doc.name}}</td>
                        <td>{{doc.date}}</td>
                    </tr>
                </tbody>
            </table>
        </div>

        <div class="modal fade" id="docModal" role="dialog" ng-show="isDocPopupVisible">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" ng-click="closeDocPopup()">×</button>
                        <h3>{{selectedDoc.name}}</h3>
                    </div>