没有将“ exportAs”设置为“ bs-modal”(“

时间:2019-01-24 07:45:17

标签: angular ngx-bootstrap ngx-bootstrap-modal

尝试了所有类似方法,例如从App.module中删除ModalModule以及其他事情,但得到相同的错误

  

错误:在没有将“ exportAs”设置为“ bs-modal”(“

     

    <div bsModal [ERROR ->]#lgModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="dialog-sizes-name")

App.module.ts

import { BsDropdownModule, ModalModule, ModalDirective } from 'ngx-bootstrap';

imports: [
    ModalModule.forRoot()]

app-routing.module.ts

const routes: Routes = [
  {
    path: 'login',
    component: LoginComponent,
  },
  { path: '', loadChildren: 'app/pages/pages.module#PagesModule' },
  { path: '**', loadChildren: 'app/pages/pages.module#PagesModule' },
];

pages.module.ts

import { ModalModule } from 'ngx-bootstrap/modal';


imports: [ModalModule.forRoot()]

dashboard.component.ts

import { ModalDirective } from 'ngx-bootstrap';
@Component({
  selector: 'ngx-dashboard',
  templateUrl: './dashboard.component.html',
  styleUrls: ["./dashboard.component.scss"]
})
export class DashboardComponent implements OnDestroy {
  @ViewChild(ModalDirective)
  lgModal: ModalDirective;

dashboard.component.html

<div bsModal #lgModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="dialog-sizes-name1">
          <div class="modal-dialog" style="width:50%;">
            <div class="modal-content">
              <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal" (click)="lgModal.hide()">&times;</button>
              </div>
              <div class="modal-body" style="overflow-y: auto;">
                <div class="row right-col">
                  <div style="padding-left: 10px; padding-right: 10px; width: 100%;">
                    <!-- My code here -->
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>

0 个答案:

没有答案