我创建了一个Angular前端,现在我希望它与我的PHP后端进行通信。运行ng服务时,我收到警告:./node_modules/@angular/http/src/backends/xhr_backend.js 167:24-52中的警告 “在'@ angular / platform-browser'中找不到导出' platform_browser_private '。Chrome显示相同的警告和错误:错误TypeError:无法读取未定义的属性'getDOM' 我该如何解决?
App.component.html:
var data = _moviesDbContext.Movies.Include(x => x.Ratings)
.Select(x => new {
Id = x.Id,
Title = x.Title,
Average = (int?)x.Ratings.Average(y => y.RatingValue)
}).OrderByDescending(x => x.Average).ThenBy(x => x.Title).Take(5).ToList();
App.component.ts:
<form class="example-form">
<mat-form-field class="example-full-width">
<input type="text" placeholder="Pick one" aria-label="Number" matInput [formControl]="myControl" [matAutocomplete]="auto">
<mat-autocomplete #auto="matAutocomplete">
<mat-option *ngFor="let option of filteredOptions | async" [value]="option">
{{option}}
</mat-option>
</mat-autocomplete>
</mat-form-field>
</form>
App.module.ts:
import {Component, OnInit} from '@angular/core';
import {FormControl} from '@angular/forms';
import {Observable} from 'rxjs';
import {map, startWith} from 'rxjs/operators';
import { ServerService } from './server.service';
/**
* @title Filter autocomplete
*/
@Component({
selector: 'app-root',
templateUrl: 'app.component.html',
styleUrls: ['app.component.css'],
})
export class AppComponent implements OnInit {
myControl = new FormControl();
megyek: string[];
filteredOptions: Observable<string[]>;
constructor(private serverService: ServerService) {}
ngOnInit() {
this.serverService.getMegyek()
.subscribe(
(megyek: any[]) => this.megyek = megyek,
(error) => console.log(error)
);
this.filteredOptions = this.myControl.valueChanges
.pipe(
startWith(''),
map(value => this._filter(value))
);
}
private _filter(value: string): string[] {
const filterValue = value.toLowerCase();
return this.megyek.filter(option => option.toLowerCase().includes(filterValue));
}
}
Server.service.ts:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { ReactiveFormsModule, FormsModule } from '@angular/forms';
import { ServerService } from './server.service';
import { HttpModule } from '@angular/http';
import { AppComponent } from './app.component';
import {
MatButtonModule,
MatFormFieldModule,
MatInputModule,
MatRippleModule,
MatAutocompleteModule,
} from '@angular/material';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import { Server } from 'selenium-webdriver/safari';
@NgModule({
exports: [
MatButtonModule,
MatFormFieldModule,
MatInputModule,
MatRippleModule,
MatAutocompleteModule,
ReactiveFormsModule,
BrowserAnimationsModule,
FormsModule,
HttpModule
],
declarations: [],
imports: []
})
export class MaterialModule {}
@NgModule({
declarations: [
AppComponent
],
imports: [
MaterialModule,
BrowserModule,
],
providers: [ServerService],
bootstrap: [
AppComponent,
],
schemas: [],
})
export class AppModule { }