componentHandler未定义

时间:2016-07-28 07:27:49

标签: angularjs typescript angular modal-dialog

你好我的伙伴stackoverflowers,

我目前正在开展一个项目。我现在有点卡住了。我试图让一个对话框工作,但到目前为止还不太好。我正处于最后阶段,我必须定义我的componentHandler才能工作。但我收到错误消息“EXCEPTION:ReferenceError:componentHandler未定义”。

这是我的AppComponent中的代码,我定义了componentHandler。

import { Component, OnInit, ViewContainerRef, Input } from '@angular/core';

import '../styles/global.css';

import { ROUTER_DIRECTIVES } from "@angular/router";
import { MODAL_DIRECTVES, BS_VIEW_PROVIDERS, CollapseDirective } from '../../node_modules/ng2-bootstrap/ng2-bootstrap';

import { LoginService } from "./services/login.service";
import { MenuService } from "./services/menu.service";
import { Menu } from './models/menu';
import { MenuGroup } from './models/menu-group';
import { MenuGroupedArea } from './models/menu-grouped-area';
import { MenuItem } from './models/menu-item';

import {ConfirmService} from "./components/confirm/confirm.service";
import {ConfirmComponent} from "./components/confirm/confirm.component";
    declare var componentHandler: any;

    @Component({
      selector: 'app-container',
      template: require('./app.component.html'),
      styles: [require('./app.component.css')],
      viewProviders: [BS_VIEW_PROVIDERS],
      directives: [MODAL_DIRECTVES, ROUTER_DIRECTIVES, CollapseDirective, ConfirmComponent],
      providers: [
        LoginService, MenuService, ConfirmService]
    })

    export class AppComponent implements OnInit {

      public isCollapsed: boolean;

      public viewContainerRef: ViewContainerRef;

      public menu: Menu;

      constructor(viewContainerRef: ViewContainerRef, private _confirmService: ConfirmService) {
        this.viewContainerRef = viewContainerRef;
        this.menu = new Menu();

        var area = new MenuGroupedArea();
        area.identifier = "Navigation";
        var group = new MenuGroup();
        group.identifier = "Group";
        var item = new MenuItem();
        item.identifier = "Item";
        group.items.push(item);
        area.groups.push(group);
        this.menu.areas.push(area);

      }

      title = "Notifier!!!"

      showConfirmDialog() {
        this._confirmService.activate("Are you sure?")
          .then(res => console.log(`Confirmed: ${res}`));
      }

      ngOnInit(): any {
          componentHandler.upgradeDom();
      }

    }

欢迎任何种类的答案或问题!

1 个答案:

答案 0 :(得分:2)

检查源代码

 <script src="https://code.getmdl.io/1.1.3/material.min.js"
                    asp-fallback-src="lib/material-design-lite/material.min.js"
                    asp-fallback-test="window.componentHandler"><== look at here