Angular 角度API快照，类型为'；IJobs'；不可分配给类型'；IJobs[]和#x27；
我正在学习并尝试在10分钟内建立一个工作板 我的API设置正常，但当我转到我的工作详细信息页面时： src/app/job detail/job detail.component.ts:49:74中出错-错误TS2322:类型“IJobs”不可分配给类型“IJobs[]” 49 this.dataService.getJobsDetail（field\u custom\u slug）.subscribe（jobs=>this.jobs=jobs） src/app/job detail/job detail.component.ts:49:74-错误TS2740:类型“IJobs”缺少类型“IJobs[]”中的以下属性：长度、弹出、推送、concat和更多 49 this.dataService.getJobsDetail（field\u custom\u slug）.subscribe（jobs=>this.jobs=jobs）Angular 角度API快照，类型为'；IJobs'；不可分配给类型'；IJobs[]和#x27；,angular,typescript,api,Angular,Typescript,Api,我正在学习并尝试在10分钟内建立一个工作板 我的API设置正常，但当我转到我的工作详细信息页面时： src/app/job detail/job detail.component.ts:49:74中出错-错误TS2322:类型“IJobs”不可分配给类型“IJobs[]” 49 this.dataService.getJobsDetail（field\u custom\u slug）.subscribe（jobs=>this.jobs=jobs） src/app/job detail/job d
但是我制作了一个接口文件，在这里我声明了每个字段以及它将包含的内容类型 job-detail.component.ts：
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { dataService } from 'src/services/data.service';
import { JobapplyService } from 'src/services/jobapply.service';
import { FormBuilder, FormGroup, FormControl, Validators, ReactiveFormsModule } from '@angular/forms';
import { IJobs } from 'src/models/jobs';
@Component({
selector: 'app-job-detail',
templateUrl: './job-detail.component.html',
styleUrls: ['./job-detail.component.scss']
})
export class JobDetailComponent implements OnInit {
jobs: IJobs[];
isShow = false;
FormData: FormGroup;
showMsg: boolean = false;
toggleDisplayForm() {
document.getElementById("jobApply").scrollIntoView({behavior: "auto", block: 'start'});
}
onSubmit(FormData) {
this.applyment.PostMessage(FormData)
.subscribe(response => {
this.showMsg = true;
response
});
}
constructor(
private route: ActivatedRoute,
private dataService: dataService,
private builder: FormBuilder,
private applyment: JobapplyService
) { }
ngOnInit() {
const field_custom_slug = this.route.snapshot.paramMap.get('field_custom_slug');
this.dataService.getJobsDetail(field_custom_slug).subscribe( jobs => this.jobs = jobs )
this.FormData = this.builder.group({
fullname: new FormControl('', [Validators.required]),
email: new FormControl('', [Validators.compose([Validators.required, Validators.email])]),
hremail: new FormControl(''),
location: new FormControl('', [Validators.required]),
placeandcountry: new FormControl('', [Validators.required]),
linkedinurl: new FormControl('', [Validators.required]),
experience: new FormControl('', [Validators.required]),
hobbies: new FormControl('', [Validators.required]),
greatfit: new FormControl('', [Validators.required]),
resume: new FormControl('', [Validators.required]),
salary: new FormControl('', [Validators.required])
})
}
}
<div *ngIf="jobs[0]">
<section class="py-4 bg-light">
<div class="container">
<div class="row">
<div class="col-md-12 d-flex align-items-center">
<a class="text-link" href="/"> home</a> <i class="fas fa-chevron-right mx-2"></i>
<a class="text-link" href="/jobs"> Jobs</a> <i class="fas fa-chevron-right mx-2"></i>
<a class="text-link" href="/jobs">{{ jobs[0].field_job_function }} at {{ jobs[0].field_company }}</a>
</div>
</div>
</div>
</section>
<section class="section-wrapper">
<div class="container">
<div class="row">
<div class="col-md-9">
<div class="row mb-5">
<div class="col-md-2">
<figure class="figure">
<img [src]="['https://cryptojobs.world/' + jobs[0].field_logo]" width="100" height="100">
</figure>
</div>
<div class="col-md-10">
<span class="d-block">
<small class="text-muted">Posted on : {{ jobs[0].created }}</small>
</span>
<h1 class="h1"></h1>
<h1 class="h1">{{ jobs[0].title }}</h1>
<h3 class="h3">{{ jobs[0].field_company }}</h3>
<ul class="list-unstyled d-flex">
<li *ngIf="jobs[0].field_is_remote" class="mr-1">{{ jobs[0].field_place }}</li>
<li *ngIf="jobs[0].field_is_remote" class="mx-1">|</li>
<li *ngIf="jobs[0].field_is_remote" class="mx-1">{{ jobs[0].field_country }}</li>
<li *ngIf="jobs[0].field_is_remote" class="mx-1">|</li>
<li *ngIf="!jobs[0].field_is_remote" class="mr-1">Remote</li>
<li *ngIf="!jobs[0].field_is_remote" class="mx-1">|</li>
<li class="ml-1">{{ jobs[0].field_job_type }}</li>
</ul>
</div>
</div>
<hr class="d-block my-3" />
<div class="mt-5" [innerHTML]="jobs[0].body"></div>
<div class="card mt-3">
<div id="jobApply" class="card-footer">
<a *ngIf="!jobs[0].field_via_external" href="{{ jobs[0].field_external_apply }}" target="_blank" class="btn btn-primary btn-lg">Apply to this Job</a>
<form class="mt-5" *ngIf="!jobs[0].field_via_form" [formGroup]="FormData" (ngSubmit)="onSubmit(FormData.value)">
<div *ngIf="!showMsg == true"></div>
<h4>Applyment form</h4>
<div class="form-row">
<div class="form-group col-md-6">
<label for="fullname">Your Fullname</label>
<input type="text" class="form-control" id="fullname" formControlName="fullname" required>
</div>
<div class="form-group col-md-6">
<label for="email">Email</label>
<input type="email" class="form-control" id="email" formControlName="email" required>
</div>
</div>
<div class="form-row">
<input type="hidden" class="d-none h-0" value="{{ jobs[0].field_hr_email }}" formControlName="hremail">
<div class="form-group col-md-6">
<label for="location">Address</label>
<input type="text" class="form-control" id="location" placeholder="1234 Main St" formControlName="location" required>
</div>
<div class="form-group col-md-6">
<label for="placeandcountry">Place and Country</label>
<input type="text" class="form-control" id="placeandcountry" placeholder="Amsterdam, Netherlands" formControlName="placeandcountry" required>
</div>
</div>
<div class="form-row">
<div class="form-group col-md-12">
<label for="linkedinurl">LinkedIn URL</label>
<input type="text" class="form-control" id="linkedinurl" placeholder="https://linkedin.com/profile/link" formControlName="linkedinurl" required>
</div>
</div>
<div class="form-row">
<div class="form-group col-md-12">
<label for="experience">How many years of experience do you have?</label>
<input type="text" class="form-control" id="experience" placeholder="8 years" formControlName="experience" required>
</div>
</div>
<div class="form-row">
<div class="form-group col-md-12">
<label for="hobbies">What kind of person are you, hobbies, family, your habits, maybe something funny?</label>
<textarea type="text" class="form-control" id="hobbies" placeholder="Tell something about yourself." formControlName="hobbies" required></textarea>
</div>
</div>
<div class="form-row">
<div class="form-group col-md-12">
<label for="greatfit">Why are you a great fit for this job?</label>
<textarea type="text" class="form-control" id="greatfit" placeholder="" formControlName="greatfit" required></textarea>
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<div class="form-group">
<label for="salary">Salary Expectation</label>
<input type="text" class="form-control" id="salary" placeholder="Give us a number of annual expectation" formControlName="salary" required>
</div>
</div>
</div>
<div class="form-row">
<div class="form-group col-md-12">
<div class="form-group">
<button type="button" class="btn btn-success" [disabled]="!FormData.valid">Submit</button>
</div>
</div>
</div>
</form>
<ng-container *ngIf="showMsg">
<div class="alert alert-success" role="alert">
Your submission send successfully to the HR manager of {{ jobs[0].field_company }}, are you ready for your next adverture?
</div>
</ng-container>
<div *ngIf="!jobs[0].field_via_form"><small><em>* We never save your personal information, this applyment send directly to the HR manager of the company and gets deleted from our database.</em></small></div>
</div>
</div>
</div>
<div class="col-md-3">
<div class="sticky-top pt-4">
<button *ngIf="!jobs[0].field_via_form" class="d-none d-md-block btn btn-primary btn-lg w-100" (click)="toggleDisplayForm()">Apply to this Job</button>
<a *ngIf="!jobs[0].field_via_external" href="{{ jobs[0].field_external_apply }}" target="_blank" class="d-none d-md-block btn btn-primary btn-lg w-100">Apply to this Job</a>
<div class="card mt-4">
<div class="card-body">
<h4 class="h4">Share this job</h4>
<ul class="list-unstyled d-flex socials">
<li>
<a href="https://www.facebook.com/sharer/sharer.php?u=https://website.com/jobs/{{ jobs[0].field_custom_slug }}" target="_blank">
<i class="fab fa-facebook-square"></i>
</a>
</li>
<li class="mx-2">
<a href="http://twitter.com/home?status=Currentlyreading https://website.com/jobs/{{ jobs[0].field_custom_slug }}" title="Click to share this post on Twitter">
<i class="fab fa-twitter-square"></i>
</a>
</li>
<li>
<a href="http://www.linkedin.com/shareArticle?mini=true&url=https://website.com/jobs/{{ jobs[0].field_custom_slug }}&title={{ jobs[0].title }} at {{ jobs[0].field_company }}&source=https://website.com/jobs/{{ jobs[0].field_custom_slug }}">
<i class="fab fa-linkedin"></i>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
发布日期：{{作业[0]。已创建}
{{jobs[0]。title}
{{jobs[0]。field_company}
{{jobs[0]。字段\u place}
|
{{jobs[0]。字段是国家}
|
远程
|
- {{jobs[0]。字段\作业\类型}