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

당 @ 리차드 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>; 

확인할 첫 번째 점은 MatInputModule을 app.module.ts에 가져 왔습니까? 그 확인의 경우

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

확인하는 2 점은, 당신은 당신이 질문에 대한 템플릿 코드를 추가하십시오 수는 matInput 지시어,

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

를 추가했다.