self.context.openSnackbar 不是函数

Question

我已经使用 material2 和 angular2 开发了应用程序。我遇到了这个错误

self.context.openSnackbar is not a function

小吃店-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

有没有人知道如何解决这个问题？

Answer 1

记住函数名区分大小写，使用这个

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

self.context.openSnackbar 不是函数

self.context.openSnackbar is not a function

angular

angular-material2