rxjs：Observble.pipe不是功能

Question

我使用VS2017 angular2模板创建了一个项目。我正尝试在我的angular2应用中使用角度/材质。有错误

this._control.stateChanges.pipe is not a function

at MatFormField.ngAfterContentInit (form-field.es5.js:327)

似乎缺少Observable的管道功能。这是我的配置问题还是rxjs更新？这里是我的配置：

"dependencies": { 
"@angular/animations": "5.0.0", 
"@angular/cdk": "^5.0.0-rc0", 
"@angular/common": "5.0.0", 
"@angular/compiler": "5.0.0", 
"@angular/compiler-cli": "5.0.0", 
"@angular/core": "5.0.0", 
"@angular/forms": "5.0.0", 
"@angular/http": "5.0.0", 
"@angular/material": "^5.0.0-rc0", 
"@angular/platform-browser": "5.0.0", 
"@angular/platform-browser-dynamic": "5.0.0", 
"@angular/platform-server": "5.0.0", 
"@angular/router": "5.0.0", 
"@ngtools/webpack": "1.8.0", 
"@types/webpack-env": "1.13.0", 
"angular-router-loader": "^0.7.0", 
"angular2-template-loader": "0.6.2", 
"aspnet-prerendering": "^3.0.1", 
"aspnet-webpack": "^2.0.1", 
"awesome-typescript-loader": "3.2.1", 
"bootstrap": "3.3.7", 
"devextreme": "^17.1.8", 
"devextreme-angular": "^17.1.8", 
"jquery": "3.2.1", 
"raw-loader": "0.5.1", 
"reflect-metadata": "0.1.10", 
"rxjs": "5.5.2", 
"typescript": "2.6.1", 
"webpack": "https://registry.npmjs.org/webpack/-/webpack-2.5.1.tgz", 
"webpack-hot-middleware": "2.18.2", 
"webpack-merge": "4.1.0", 
"zone.js": "0.8.12" 
} 

更新 我发现，这个问题不仅在物质发生，但所有的观测。

import { Observable } from 'rxjs/Observable'; 
import { BehaviorSubject } from 'rxjs/BehaviorSubject'; 

loggedIn = new BehaviorSubject<boolean>(false); 

ngOnInit() { 
    this.loggedIn.pipe((p) => p); 
} 

运行时间错误：

ERROR TypeError: this.loggedIn.pipe is not a function at AppComponent.webpackHotUpdate.362.AppComponent.ngOnInit (app.component.ts?a73a:23) at checkAndUpdateDirectiveInline (core.js:12094) at checkAndUpdateNodeInline (core.js:13597) at checkAndUpdateNode (core.js:13540) at debugCheckAndUpdateNode (core.js:14412) at debugCheckDirectivesFn (core.js:14353) at Object.eval [as updateDirectives] (AppComponent_Host.ngfactory.js:9) at Object.debugUpdateDirectives [as updateDirectives] (core.js:14338) at checkAndUpdateView (core.js:13507) at callWithDebugContext (core.js:14739)

Answer 1

每@Richard Matsen的评论，只需使用aspnetcore-angular2-universal

与VS2017启动项目

Answer 2

错误消息被从这个代码块的到来，在material2/src/lib/form-field/form-field.ts

// Subscribe to changes in the child control state in order to update the form field UI. 
this._control.stateChanges.pipe(startWith(null!)).subscribe(() => { 
    this._validatePlaceholders(); 
    this._syncDescribedByIds(); 
    this._changeDetectorRef.markForCheck(); 
}); 

和this._control 180线从在线模板中设置157

@ContentChild(MatFormFieldControl) _control: MatFormFieldControl<any>; 

首先要检查的是，您是否在app.module.ts中导入了MatInputModule？

import {MatInputModule} from '@angular/material'; 
@NgModule({ 
    imports: [ 
    ... 
    MatInputModule 
    ... 
] 

第二件事来检查，你加matInput指令，

<mat-form-field> 
    <input matInput placeholder="Input"> 
</mat-form-field> 

如果没关系，你可以请添加模板代码的问题。