2016-07-18 6 views
0

У меня есть pizza.component.ts как этотNG2-самозагрузка модальный не могут открыть модальный

import {Component,ViewContainerRef} from '@angular/core'; 
import { CORE_DIRECTIVES } from '@angular/common'; 
import { BUTTON_DIRECTIVES } from 'ng2-bootstrap/ng2-bootstrap'; 
import {MODAL_DIRECTIVES, BS_VIEW_PROVIDERS} from 'ng2-bootstrap/ng2-bootstrap'; 

@Component({ 
    selector: 'pizza-com', 
    templateUrl: './app/pizza/pizza.html', 
    directives: [BUTTON_DIRECTIVES,MODAL_DIRECTIVES,CORE_DIRECTIVES], 
    viewProviders:[BS_VIEW_PROVIDERS], 
}) 
export class PizzaComponent { 
    public constructor(viewContainerRef:ViewContainerRef) { 
    // You need this small hack in order to catch application root view container ref 
    this.viewContainerRef = viewContainerRef; <<<---this doesn't seems to work dunno why 
    } 
} 

и мой pizza.html как этот

<!-- Large modal --> 
<button class="btn btn-primary" (click)="lgModal.show()">Large modal</button> 

<div bsModal #lgModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true"> 
    <div class="modal-dialog modal-lg"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <button type="button" class="close" (click)="lgModal.hide()" aria-label="Close"> 
      <span aria-hidden="true">&times;</span> 
     </button> 
     <h4 class="modal-title">Large modal</h4> 
     </div> 
     <div class="modal-body"> 
     ... 
     </div> 
    </div> 
    </div> 
</div> 

, когда я нажимаю кнопку модальной это шоу ошибка

platform-browser.umd.js:1900 
EXCEPTION: Error: Uncaught (in promise): 
TypeError: Cannot read property 'parentInjector' of undefined 

все, что я сделал не так?

я также следовать the example в NG2-загрузчике, но this.viewContainerRef, похоже, не работает

ответ

0

Я использование угловой 2 Заключительный/NG2-Bootstrap 1.1.3/systemjs

import { Component, ViewContainerRef } from '@angular/core'; 
@Component({ 
    selector: 'app-root', 
    template: '<router-outlet></router-outlet>', 
    encapsulation: ViewEncapsulation.None 
}) 
export class AppComponent implements OnInit { 
    private viewContainerRef: ViewContainerRef; 

    constructor(viewContainerRef: ViewContainerRef) { 
    this.viewContainerRef = viewContainerRef; 
    } 
} 
Смежные вопросы