angular - Angular 8 返回 Observable从函数
问题描述
如何在函数中返回Observable<boolean>
true ?after
this.Form = new FormGroup(formControls);
GetDataFromService()
html
<form *ngIf="loading | async" [formGroup]="Form" class="example-form">
</form>
<mat-spinner *ngIf="!loading | async"></mat-spinner>
TS
import { Component, OnInit } from '@angular/core';
import { MatDialogRef } from '@angular/material/dialog';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { FormGroup, FormBuilder, AbstractControl, FormControl } from '@angular/forms';
import { Observable, observable } from 'rxjs';
@Component({
selector: 'app-add-product-dialog',
templateUrl: './add-product-dialog.component.html',
styleUrls: ['./add-product-dialog.component.css']
})
export class AddProductDialogComponent implements OnInit {
properties: any;
Form: FormGroup = new FormGroup({});
loading: Observable<boolean>;
constructor(private formBuilder: FormBuilder,
public dialogRef: MatDialogRef<AddProductDialogComponent>,
private http: HttpClient) {
this.loading = this.GetDataFromService();
}
GetDataFromService(): Observable<Boolean> {
let headers = new HttpHeaders();
headers = headers.set('Content-Type', 'application/json; charset=utf-8');
let formControls: { [key: string]: AbstractControl } = {};
this.http.get("https://localhost:44346/api/Values/GetDrillsProperties", { headers: headers }).subscribe(data => {
this.properties = data
Object.keys(this.properties).forEach(element => {
formControls[element] = new FormControl();
});
this.Form = new FormGroup(formControls);
});
}
}
解决方案
您可以从 'rxjs/operators' 导入地图并使用它
return this.http.get("https://localhost:44346/api/Values/GetDrillsProperties", { headers: headers }).pipe(map(res => {
this.properties = res
Object.keys(this.properties).forEach(element => {
formControls[element] = new FormControl();
})
this.Form = new FormGroup(formControls);
return true;
})) as Observable<boolean>;
推荐阅读
- html - django 没有通过使用表单中的 post 请求在前端提交响应
- c# - Unity3D - Google Play 64 位要求的问题
- google-cloud-platform - 试用期后移除 Google Cloud 项目资源
- ios - 核心蓝牙扫描未返回所有设备
- amazon-web-services - AWS CodeBuild 和 CodeCommit 存储库作为 npm 依赖项
- android - 如何防止 EditText 中第一个单词的空格?可以在xml不是代码吗?
- c# - 在我们的应用程序中拍摄的照片上添加徽标,例如 B612 相机应用程序
- java - 无法在 Spring MVC 测试中自动装配 sessionFactory
- git - 即使没有冲突,如何防止 git merge 或 git rebase 更改指定文件?
- sql - 部分设置plsql参数