self.context.openSnackbar不是一个函数

时间:2017-03-07 11:03:54

标签: angular angular-material2

我使用material2和angular2处理了应用程序。我有这个错误

  

self.context.openSnackbar不是函数

小吃吧-material.html

<button md-button (click)="openSnackbar()">Trigger Snackbar</button>

TS功能:

import { Component} from '@angular/core';
import {MdSnackBar} from '@angular/material';

@Component({
    templateUrl:'snackbar-material.html',
})
export class SnackbarOverviewComponent{
 constructor(
        public snackBar: MdSnackBar) {}
openSnackBar() {
this.snackBar.open("Showing Snack", "Yayyy!");
}
}

错误:

 EXCEPTION: Error in ./SnackbarOverviewComponent class SnackbarOverviewComponent - inline template:0:0 caused by: self.context.openSnackbar is not a function  vendor.bundle.js:61055:9
ORIGINAL EXCEPTION: self.context.openSnackbar is not a function  vendor.bundle.js:61057:13
ORIGINAL STACKTRACE:  vendor.bundle.js:61060:13
anonymous/View_SnackbarOverviewComponent0.prototype.handleEvent_0@/MaterialAppModule/SnackbarOverviewComponent/component.ngfactory.js:56:21
DebugAppView.prototype.eventHandler/<@http://localhost:4200/vendor.bundle.js:86216:24
decoratePreventDefault/<@http://localhost:4200/vendor.bundle.js:48265:53
ZoneDelegate.prototype.invokeTask@http://localhost:4200/vendor.bundle.js:111222:21
NgZone.prototype.forkInnerZoneWithAngularBehavior/this.inner<.onInvokeTask@http://localhost:4200/vendor.bundle.js:31689:28
ZoneDelegate.prototype.invokeTask@http://localhost:4200/vendor.bundle.js:111221:21
Zone.prototype.runTask@http://localhost:4200/vendor.bundle.js:111111:28
ZoneTask/this.invoke@http://localhost:4200/vendor.bundle.js:111292:28
  vendor.bundle.js:61061:13
ERROR CONTEXT:  vendor.bundle.js:61064:13
Object { _view: Object, _nodeIndex: 0, _tplRow: 0, _tplCol: 0 }  vendor.bundle.js:61065:13
Error: Error in ./SnackbarOverviewComponent class SnackbarOverviewComponent - inline template:0:0 caused by: self.context.openSnackbar is not a function

有人有点想法,如何解决这个问题?

1 个答案:

答案 0 :(得分:1)

记住功能名称区分大小写,请使用此

<button md-button (click)="openSnackBar()">Trigger Snackbar</button>