ng2-bootstrap-modal не работает после компиляции webpack - PullRequest
Новая
       7

ng2-bootstrap-modal не работает после компиляции webpack

0 голосов
/ 11 мая 2018

Я добавил в свой угловой проект ng2-bootstrap-modal и выполнил шаги, рекомендованные в этом URL: https://www.npmjs.com/package/ng2-bootstrap-modal

Everiting работает хорошо, пока я не опубликую его [код был «скомпилирован» с помощью веб-пакета] в FAT env. Из того, что я понимаю, это не может создать диалоговое окно.

Я глубоко копаюсь в модальном коде и обнаружил, что ошибка находится в "DialogService.prototype.createDialogHolder" из dialog.service.js

Исходный код компонента выглядит так: 

DialogService.prototype.createDialogHolder = function () {
    var _this = this;
    var componentFactory = this.resolver.resolveComponentFactory(dialog_holder_component_1.DialogHolderComponent);
    var componentRef = componentFactory.create(this.injector);
    var componentRootNode = componentRef.hostView.rootNodes[0];
    if (!this.container) {
        var componentRootViewContainer = this.applicationRef['_rootComponents'][0];
        this.container = componentRootViewContainer.hostView.rootNodes[0];
    }
    this.applicationRef.attachView(componentRef.hostView);
    componentRef.onDestroy(function () {
        _this.applicationRef.detachView(componentRef.hostView);
    });
    this.container.appendChild(componentRootNode);
    return componentRef.instance;
};

Код после компиляции веб-пакета выглядит так: 

t.prototype.createDialogHolder = function() {
        var t = this
          , e = this.resolver.resolveComponentFactory(u.DialogHolderComponent)
          , n = e.create(this.injector)
          , r = n.hostView.rootNodes[0];
        if (!this.container) {
            var o = this.applicationRef._rootComponents[0];
            this.container = o.hostView.rootNodes[0]
        }
        return this.applicationRef.attachView(n.hostView),
        n.onDestroy(function() {
            t.applicationRef.detachView(n.hostView)
        }),
        this.container.appendChild(r),
        n.instance
    }

И ошибка в строке: 

var o = this.applicationRef._rootComponents[0];

Потому что _rootComponents имеет значение null.

У вас есть идеи, как это исправить? Примечание: код на 100% такой же, как в приведенной выше ссылке.

Upd: в app.module.ts я пытался импортировать BootstrapModalModule с контейнером по умолчанию, а также с конкретным контейнером BootstrapModalModule.forRoot ({container: document.body})

1 Ответ

0 голосов
/ 11 мая 2018

Следующий ответ действителен для простого bootstrap.Но поскольку ngx-bootstrap (он же ng2-bootstrap) построен на простой начальной загрузке, это все еще может иметь значение.

Я заметил, что импорт bootstrap.css в файл .angular-cli.json, как рекомендуется для ngx работал в режиме dev , но не работал после компиляции с webpack.

Импорт начальной загрузки в файл src/styles.css, как в этот пост сделал свое делодля меня.

...