<table class="table table-bordered">
<thead>
<tr>
<td>Name</td>
<td>Profile</td>
<td>Cgpa Criteria</td>
<td width="275" align="center">Action</td>
</tr>
</thead>
<tbody>
<tr *ngFor="let company of companies">
<td>{{company.name}}</td>
<td>{{company.profile}}</td>
<td>{{company.cgpaCriteria}}</td>
<td width="275">
<a class="btn btn-info" routerLink="/showCompany/{{company._id}}">Detail</a>
<a class="btn btn-success" routerLink="/editCompany/{{company._id}}">Edit</a>
<a class="btn btn-info" routerLink="/matchCriteria/{{company.cgpaCriteria}}/{{company.profile}}">Find Students</a>
<a class="btn btn-danger" (click)="deleteCompany(company._id)">Delete</a>
</td>
</tr>`enter code here`
</tbody>
</table>
Это файл company.html, в котором отображается список всех компаний.Эта часть работает, когда мы нажимаем кнопку «Найти студентов», должны отображаться студенты, которые соответствуют критериям компании.Там нет ошибки, но студенты не отображаются.
import { Component, OnInit } from '@angular/core';
import {CompService} from '../../comp.service'
import {Company} from '../../company'
@Component({
selector: 'app-companies',
templateUrl: './companies.component.html',
styleUrls: ['./companies.component.css']
})
export class CompaniesComponent implements OnInit {
constructor(
public compService:CompService
) { }
ngOnInit() {
this.getCompanies();
}
model = new Company();
companies:Company;
getCompanies()
{
this.compService.getCompanies().subscribe(companies=>{this.companies = companies;
})
}
deleteCompany(id){
this.compService.deleteCompany(id)
.subscribe(()=>{
this.getCompanies()
})
}
}
Это файл companies.component.ts, который содержит функцию
<table class="table table-bordered">
<thead>
<tr>
<td>Name</td>
<td>Department</td>
<td>Cgpa </td>
<td width="275" align="center">Action</td>
</tr>
</thead>
<tbody>
<tr *ngFor="let student of students">
<td>{{student.name}}</td>
<td>{{student.department}}</td>
<td>{{student.cgpa}}</td>
<td width="275">
<a class="btn btn-info" routerLink="/showCompany/{{student._id}}">Register Student</a>
<a class="btn btn-success" routerLink="/editCompany/{{student._id}}">UnRegister Student</a>
<a class="btn btn-info" routerLink="/matchCriteria/{{company._cgpaCriteria}}/{{company.profile}}">Register Students</a>
<a class="btn btn-danger" (click)="deleteCompany(company._id)">Delete</a>
</td>
</tr>
</tbody>
</table>
Это файл register.component.html
import { Component, OnInit } from '@angular/core';
import {FormBuilder, FormGroup , Validators} from '@angular/forms';
import { ActivatedRoute, Params, Router } from '@angular/router';
import {StudService} from '../../stud.service'
import {Student} from '../../student'
@Component({
selector: 'app-register-student',
templateUrl: './register-student.component.html',
styleUrls: ['./register-student.component.css']
})
export class RegisterStudentComponent implements OnInit {
constructor(
public studService:StudService,
public route:ActivatedRoute,
public router:Router
) { }
model = new Student();
students:Student;
cgpa = this.route.snapshot.params['cgpa'];
department = this.route.snapshot.params['department'];
registerStudents()
{
this.studService.getStudentBasis(this.cgpa,this.department)
.subscribe(student=>{
this.model = student;
})
}
ngOnInit() {
this.registerStudents()
}
}
this is the registercomponent.ts file which is used when we click on find students
import { Injectable } from '@angular/core';
import {Http} from '@angular/http';
import 'rxjs/add/operator/map';
@Injectable()
export class StudService {
constructor(private http:Http) { }
getStudents()
{
return this.http.get("http://localhost:3000/api/students").map(res =>res.json());
}
getStudent(id)
{
return this.http.get("http://localhost:3000/api/show/"+id).map(res =>res.json());
}
addStudent(info)
{
return this.http.post("http://localhost:3000/api/registerstudent",info).map(res =>res.json());
}
deleteStudent(id)
{
return this.http.delete("http://localhost:3000/api/removestudent/"+id).map(res =>res.json());
}
updateStudent(id , info)
{
return this.http.put("http://localhost:3000/api/updatestudent/"+id,info).map(res =>res.json());
}
getStudentBasis(cgpa,department)
{
return this.http.get("http://localhost:3000/api/findStudent/"+cgpa+"/"+department).map(res=>res.json());
}
}
Этофайл studService.ts, который содержит все функции Это страница, которая отображает список компаний
Эта страница открывается, когда мы нажимаем на поиск студентов, как вы можетене видно ни одного ученика, но когда я запускаю его на localhost: 3000, функция, написанная в бэкэнде, работает