我已导入所需的模块,但也检查了错误,但没有任何帮助。 我是新手,仍然在学习。
这是我的app.module.ts文件
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { CommonModule } from "@angular/common";
import { AppComponent } from './app.component';
import { ContactsComponent } from './contacts/contacts.component';
@NgModule({
declarations: [
AppComponent,
ContactsComponent
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
CommonModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
这里的代码部分不起作用,但也没有工作抛出任何错误。
<div class="container">
<div *ngFor = "let contact of contacts" >
<div class = "col-md-3">
{{contact.first_name}}
</div>
<div class = "col-md-3">
{{contact.last_name}}
</div>
<div class = "col-md-3">
{{contact.phone}}
</div>
<div class = "col-md-3">
<input type="button" (click)="deleteContact(contact._id)" value ="Delete" class="btn btn-danger" />
</div>
</div>
</div>
更新:我已经包含了我的contact.srevice.ts文件。
import { Injectable } from '@angular/core';
import {Http, Headers} from '@angular/http';
import {Contact} from './contact';
import 'rxjs/add/operator/map';
import {Observable} from 'rxjs/Observable';
@Injectable()
export class ContactService {
constructor(private http: Http) { }
//retrieving contact_service
getContacts() :Observable<any[]>
{
return this.http.get('http://localhost:3000/api/contacts')
.map(res => res.json());
}
//add contact method
addContact(newContact){
var headers = new Headers();
headers.append('Content-Type','application/json');
return this.http.post('http://localhost:3000/api/contact', newContact, {headers:headers})
.map(res=>res.json());
}
//delete Contact Method
deleteContact(id){
return this.http.delete('http://localhost:3000/api/contact/'+id)
.map(res=>res.json());
}
}
答案 0 :(得分:1)
根据您的dates = pd.to_datetime(data['Order Date']).dt.strftime('%m-%d-%Y')
代码,您需要将一些数据绑定到名为.ts
的对象,以使其正常工作
contacts
你需要绑定数据,无论你从这个服务得到什么 -
contacts = [
{first_name: "Pardeep", last_name: "Jain", phone: '90'},
{first_name: "Pardeep", last_name: "Jain", phone: '90'},
{first_name: "Pardeep", last_name: "Jain", phone: '90'}
]
答案 1 :(得分:1)
你需要这样做
import { Component } from '@angular/core';
import {Contact} from './contact';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css'] })
export class AppComponent implements OnInit
{
title = 'New App';
contacts: Contact[];
ngOnInit() {
this.service.getContacts()
.subscribe(data=> this.contacts = data)
}
}
contact.service.ts文件
//make use of newer api of http
import { HttpClient, HttpHeaders } from '@angular/common/http';
export class ContactService {
constructor(private http: HttpClient) { }
getContacts() :Observable<Contact[]>
{
return
this.http.get<Contact[]>('http://localhost:3000/api/contacts');
}
addContact(newContact) {
const httpOptions = {
headers: new HttpHeaders({
'Content-Type': 'application/json',
})
};
return this.http.post('http://localhost:3000/api/contact', newContact, httpOptions)
.map(res=>res.json());
}
}