ngFor when for new data Angular 8.2.14
ngFor when for new data Angular 8.2.14
正在尝试更新 html table 迭代 ngFor 中每个订单的数据。我已经尝试了几种方法，包括传播运算符中的 ChangeDetectorRef trackBy 和 reloadData。我离成功还差得很远。 trackBy 似乎很有前途，但当我不断努力解决无限循环时，我放弃了。我将在此处包含一些代码，并在需要时提供更多代码。
getStewartOrders() {
this.http.get(this.config.data.StewartOrdersUrl).subscribe((data: any) => {
console.log(data.response.orders, "STEWART DATA");
// debugger;
this.orderTable = false;
this.ngZone.run(() => {
let data1 = data.response.orders;
for(let i = 0; i < data1.length; i++) {
this.stewartorders.push(data1[i]);
}
// this.stewartorders = cloneDeep(data1);
this.orderTable = true;
});
/* this.stewartorders = data.response.orders.filter(stewart => {
return stewart.file_seq_nbr == this.fileSeqNbr;
}); */
console.log(this.stewartorders, "STEWART ORDER");
// this.ref.detach();
this.ref.detectChanges();
// this.ref.reattach();
});
}
trackOrder(index: number, orders: any) {
console.log('TRACKBY');
return orders.order_ref;
}
<ng-container *ngIf="orderTable">
<tr *ngFor="let orders of stewartorders; trackBy: trackOrder;
let orderIndex = index;"
class="row-stewart-results">
<td>Stewart Orders</td>
<td>{{orders.order_date | date:"MM/dd/yyyy"}}</td>
<td title="{{orders.order_ref}}" class="orderRefCell">
{{orders.order_ref}}
</td>
<td>{{orders.product_name}}</td>
<td>{{orders.order_status}}</td>
<td>{{stewartorders.length}}{{orders.orderedby_name}}</td>
<td>
<a class="link-text link-import-results" *ngIf="orders.import_sw !== 'Y'" (click)="openStewartImportModal(orderIndex)">
<i class="fas fa-file-import text-blue" tooltip="Import"></i>
</a>
</td>
</tr>
</ng-container>
trackOrders(index: number, orders: any):string {
console.log('TRACKTHIS');
console.log(orders);
return orders[index].order_ref
}
getData() {
this.http.get(this.config.data.propertyFormInfo).subscribe((data: any) => {
this.form_info = data.response.form_info;
this.cancel_link = data.response.cancel_link;
this.next_link = data.response.save_continue_link;
this.pa_municipalities_link = data.response.pa_municipalities_link;
this.userName = data.meta.user_name;
this.userEmail = data.meta.user_email;
this.meta = data.meta;
this.propertyInfoForm.get('company_id').setValue(data.meta.company_id)
this.backtittle_links = data.response.backtittle_links;
this.eclosing_partners = data.response.eclosing_partners;
this.standardPermissions = data.response.standard_permission;
this.fundHolidays = data.response.interface_values;
this.checkPermission();
if (data.response.orders.has_stewart_records === '1') {
this.getStewartOrders();
}
});
}
斯图尔特订单 ts
import { Component, OnInit } from '@angular/core';
import { Validators, FormBuilder, FormGroup, FormControl } from '@angular/forms'
import { HttpClient } from '@angular/common/http';
import { BsModalService, BsModalRef } from 'ngx-bootstrap/modal';
import { BsDatepickerConfig } from 'ngx-bootstrap/datepicker';
import { ApplicationConfiguration } from 'projects/framework/src/lib/ApplicationConfiguration';
import { SharedService } from '../../services/shared.service';
import { EcCommonActionscriptModalComponent } from '../../ec-common/ec-common-actionscript-modal/ec-common-actionscript-modal.component';
import { AlertType, ModalAlert } from 'projects/framework/src/lib/ec-common/ec-common-modal-alert/modal-alert';
import { Alert } from '../../ec-common/ec-common-alert/alert';
import { KeyValue } from '@angular/common';
import { Subject } from 'rxjs';
import { PropertyInfoComponent } from 'projects/ui-app/src/app/pages/property-info/property-info.component';
@Component({
providers: [PropertyInfoComponent],
selector: 'app-stewart-order',
templateUrl: './stewart-order.component.html',
styleUrls: ['./stewart-order.component.css'],
})
export class StewartOrderComponent implements OnInit {
public onClose: Subject<any>;
transactiontype: any;
config: ApplicationConfiguration;
stewartOrderForm: FormGroup;
isFormSubmitted = false;
currentTab = 0;
stewart_forminfo: any;
form_info: any = {};
controlCaptions: any = {};
alert_info: any;
public dpConfig: Partial<BsDatepickerConfig> = new BsDatepickerConfig();
buyersList: any;
fileSeqNbr: string;
buyersTableSettings: any;
showBuyyerForm: boolean;
propertyData: any = {};
disclimer: any;
ID: any;
sellersList: any;
showSellerForm: boolean;
sellersTableSettings: any;
orderSubmitted: boolean;
fundUploadFileUrl: string;
isContactingServer: boolean;
isSubmitting = false;
zipPlaced = "012345678";
constructor(private http: HttpClient,
private modalService: BsModalService,
private sharedService: SharedService,
private propComp: PropertyInfoComponent,
public applicationConfiguration: ApplicationConfiguration,
private fb: FormBuilder,
public modalRef: BsModalRef) {
this.config = applicationConfiguration;
}
ngOnInit() {
this.dpConfig.containerClass = 'theme-dark-blue';
this.dpConfig.showWeekNumbers = false;
this.onClose = new Subject();
this.initForm();
//this.getStewartInfo();
this.fundUploadFileUrl = this.config.data.fundUploadFileUrl;
//this.form_info = this.form_info;
let productGroup = new FormGroup({});
this.form_info.product_types.forEach(product_type => {
if (product_type.allow_multiples) {
for (const product in product_type.products) {
productGroup.addControl(product, new FormControl());
}
}
else {
productGroup.addControl(product_type.name, new FormControl());
}
});
this.stewartOrderForm.addControl('products', productGroup);
// this.stewart_forminfo = this.stewart_forminfo;
//this.stewart_forminfo.needed_by = this.sharedService.formatDate(this.stewart_forminfo.needed_by);
this.stewart_forminfo.needed_by = '';
this.stewart_forminfo.transaction_types = '1';
this.stewartOrderForm.patchValue(this.stewart_forminfo);
this.stewartOrderForm.controls['needed_by'].valueChanges.subscribe(value=>{
this.validateNeedeBy(value);
})
}
selectedTab(index) {
this.currentTab = index;
}
selectTabBtn(index) {
if (!this.onTabChangeBtn()) {
this.currentTab = index;
}
}
onTabChangeBtn() {
switch (this.currentTab) {
case 0:
return this.ValidateGeneralTab();
break;
case 2:
return this.validateIOrderTab();
break;
default:
return '';
break;
}
}
validateNeedeBy(needed_by) {
const initialState = {
message: ''
};
let neededby = new Date(needed_by?needed_by:this.stewartOrderForm.value.needed_by);
let defaultDate = new Date(this.stewart_forminfo.needed_by);
if (neededby < defaultDate) {
initialState.message = initialState.message + ' ' + ' Needed by should be more then 5 days';
}if (initialState.message) {
const alert = new ModalAlert({ message: initialState.message });
alert.type = AlertType.Error;
this.sharedService.addModalAlert(alert);
}
return initialState.message;
}
ValidateGeneralTab() {
const initialState = {
message: ''
};
if (!this.stewartOrderForm.value.transaction_types || !this.stewartOrderForm.value.needed_by) {
initialState.message = initialState.message + ' ' + 'You must select transaction type, product type and Needed by';
}
if (initialState.message) {
const alert = new ModalAlert({ message: initialState.message });
alert.type = AlertType.Error;
this.sharedService.addModalAlert(alert);
}
return initialState.message;
}
validateIOrderTab() {
const initialState = {
message: ''
};
if (!this.stewartOrderForm.value.street_types) {
initialState.message = initialState.message + ' ' + 'You must select street type';
}
if (initialState.message) {
const alert = new ModalAlert({ message: initialState.message });
alert.type = AlertType.Error;
this.sharedService.addModalAlert(alert);
}
return initialState.message;
}
getScannedFiles() {
let data = this.propertyData;
data.file_seq_nbr = this.propertyData.fileSeqNbr
data.company_id = this.propertyData.company_id;
this.http.post(this.config.data.getStewartUrl, data).subscribe((data: any) => {
this.form_info = data.response.form_info;
const save_needed_by = this.stewartOrderForm.value.needed_by;
this.stewartOrderForm.patchValue(this.stewart_forminfo);
this.stewartOrderForm.patchValue({needed_by: save_needed_by});
});
}
onUpload(event) {
this.getScannedFiles();
}
initForm() {
this.isSubmitting = false;
this.stewartOrderForm = this.fb.group({
fileSeqNbr: [this.fileSeqNbr],
transaction_types: ['', Validators.required],
transaction_type: [''],
product_type: ['', Validators.required],
buyer: [''],
seller: [''],
buyer1: [''],
seller1: [''],
lender: [''],
loan_number: [''],
loan_amount: [''],
purchase_price: [''],
street_number: [''],
street_name: [''],
specialinstructions: [''],
unit_number: [''],
parcel_number: [''],
subdivision: [''],
section: [''],
township: [''],
range: [''],
lot: [''],
book: [''],
page: [''],
block: [''],
street_direction_prefixes: [''],
street_direction_suffixes: [''],
unit_types: [''],
street_types: [''],
phase: [''],
acreage: [''],
needed_by: ['', Validators.required],
property_type: [''],
loan_type: [''],
county: [''],
building: [''],
city: [''],
state: [''],
zipcode: [''],
disclaimer_text: [''],
});
this.controlCaptions = {
transaction_type: 'transaction type',
product_type: 'business segment',
need_by: 'needed by',
};
}
isFormValid = false;
validatestewartFrom() {
this.isFormValid = false;
if (this.ValidateGeneralTab()) {
return false;
}
if (this.validateIOrderTab()) {
return false;
}
this.isFormValid = true;
return true;
}
submitOrder() {
this.isFormSubmitted = true;
if (!this.validatestewartFrom()) {
return
}
this.isSubmitting = true;
let data: any =
{
"acreage": "",
"apn": "",
"block": this.stewartOrderForm.value.block,
"book": this.stewartOrderForm.value.bock,
"building": this.stewartOrderForm.value.building,
"county": this.stewartOrderForm.value.county,
"need_by": this.stewartOrderForm.value.needed_by,
"loan_type": this.stewartOrderForm.value.loan_type,
"lot": this.stewartOrderForm.value.lot,
"order_guid": "",
"page": this.stewartOrderForm.value.page,
"phase": this.stewartOrderForm.value.phase,
"prop_city": this.stewartOrderForm.value.city,
"prop_zip": this.stewartOrderForm.value.zipcode,
"property_type": this.stewartOrderForm.value.property_type,
"range": this.stewartOrderForm.value.range,
"searchtype": "",
"section": this.stewartOrderForm.value.section,
"specialinstructions": this.stewartOrderForm.value.specialinstructions,
"state": this.stewartOrderForm.value.state,
"street_direction_prefix": this.stewartOrderForm.value.street_direction_prefixes,
"street_direction_suffix": this.stewartOrderForm.value.street_direction_suffixes,
"street_name": this.stewartOrderForm.value.street_name,
"street_nbr": this.stewartOrderForm.value.street_number,
"street_type": this.stewartOrderForm.value.street_types,
"subdivision": this.stewartOrderForm.value.subdivision,
"township": this.stewartOrderForm.value.township,
"transaction_type": this.stewartOrderForm.value.transaction_types,
"unit_from": "",
"unit_number": this.stewartOrderForm.value.unit_number,
"unit_to": this.stewartOrderForm.value.unit_to,
"unit_type": this.stewartOrderForm.value.unit_types,
"updatenotes": "",
"loan_amount": this.stewartOrderForm.value.loan_amount,
"purchase_price": this.stewartOrderForm.value.purchase_price,
"lender": this.stewartOrderForm.value.lender,
"loan_number": this.stewartOrderForm.value.loan_number
}
let products = [];
for (const key in this.stewartOrderForm.value.products) {
if (Object.prototype.hasOwnProperty.call(this.stewartOrderForm.value.products, key)) {
if (this.stewartOrderForm.value.products[key]) { // Could be null if no product of this sort selected
products.push(this.stewartOrderForm.value.products[key]);
}
}
}
data.product = products.join(',')
data.saved_documents = this.form_info.scanned_files.filter(file => {
return file.isChecked
}).map(file => {
return file.key
}).join('|');
data.borrowers = this.form_info.borrowers;
data.sellers = this.form_info.sellers;
this.http.post(this.form_info.submit_link, data).subscribe((data: any) => {
if (data.meta.status != 'SUCCESS') {
let alert = new Alert({ message: data.meta.status_message });
alert.type = AlertType.Error
this.sharedService.addAllert(alert);
}
else {
let alert = new Alert({ message: data.meta.status_message });
alert.type = AlertType.Success
this.sharedService.addAllert(alert);
}
// window.location.reload();
this.propComp.reloadStewart();
// this.propComp.ngOnInit();
// this.propComp.reloadData();
// this.addData(data);
// this.onClose.next(this.form_info);
this.modalRef.hide();
});
}
// public data = [];
// addData(data){
// this.data.push(data);
// }
// Need to display some lists alphabetically by the display vvlue
alphaByValue = (a: KeyValue<number,string>, b: KeyValue<number,string>): number => {
return a.value.localeCompare(b.value);
}
}
我能够通过利用数据绑定并通过将数据从模块传回外部组件来推送到数组来解决这个问题：
我添加的创建订单按钮：
(onNewOrders)="addNewStewartOrders($event)"
方法在模块关闭后命中
addNewStewartOrders(event){
this.stewartorders.push.apply(this.stewartorders, event);
}
从模态返回命令按钮组件：
this.modalRef.content.onClose.subscribe((newOrders:any) => {
console.log(newOrders, 'newOrders STEWART')
this.onNewOrders.emit(newOrders);
});
this.onClose.next(data.response.orders);
正在尝试更新 html table 迭代 ngFor 中每个订单的数据。我已经尝试了几种方法，包括传播运算符中的 ChangeDetectorRef trackBy 和 reloadData。我离成功还差得很远。 trackBy 似乎很有前途，但当我不断努力解决无限循环时，我放弃了。我将在此处包含一些代码，并在需要时提供更多代码。
getStewartOrders() {
this.http.get(this.config.data.StewartOrdersUrl).subscribe((data: any) => {
console.log(data.response.orders, "STEWART DATA");
// debugger;
this.orderTable = false;
this.ngZone.run(() => {
let data1 = data.response.orders;
for(let i = 0; i < data1.length; i++) {
this.stewartorders.push(data1[i]);
}
// this.stewartorders = cloneDeep(data1);
this.orderTable = true;
});
/* this.stewartorders = data.response.orders.filter(stewart => {
return stewart.file_seq_nbr == this.fileSeqNbr;
}); */
console.log(this.stewartorders, "STEWART ORDER");
// this.ref.detach();
this.ref.detectChanges();
// this.ref.reattach();
});
}
trackOrder(index: number, orders: any) {
console.log('TRACKBY');
return orders.order_ref;
}
<ng-container *ngIf="orderTable">
<tr *ngFor="let orders of stewartorders; trackBy: trackOrder;
let orderIndex = index;"
class="row-stewart-results">
<td>Stewart Orders</td>
<td>{{orders.order_date | date:"MM/dd/yyyy"}}</td>
<td title="{{orders.order_ref}}" class="orderRefCell">
{{orders.order_ref}}
</td>
<td>{{orders.product_name}}</td>
<td>{{orders.order_status}}</td>
<td>{{stewartorders.length}}{{orders.orderedby_name}}</td>
<td>
<a class="link-text link-import-results" *ngIf="orders.import_sw !== 'Y'" (click)="openStewartImportModal(orderIndex)">
<i class="fas fa-file-import text-blue" tooltip="Import"></i>
</a>
</td>
</tr>
</ng-container>
trackOrders(index: number, orders: any):string {
console.log('TRACKTHIS');
console.log(orders);
return orders[index].order_ref
}
getData() {
this.http.get(this.config.data.propertyFormInfo).subscribe((data: any) => {
this.form_info = data.response.form_info;
this.cancel_link = data.response.cancel_link;
this.next_link = data.response.save_continue_link;
this.pa_municipalities_link = data.response.pa_municipalities_link;
this.userName = data.meta.user_name;
this.userEmail = data.meta.user_email;
this.meta = data.meta;
this.propertyInfoForm.get('company_id').setValue(data.meta.company_id)
this.backtittle_links = data.response.backtittle_links;
this.eclosing_partners = data.response.eclosing_partners;
this.standardPermissions = data.response.standard_permission;
this.fundHolidays = data.response.interface_values;
this.checkPermission();
if (data.response.orders.has_stewart_records === '1') {
this.getStewartOrders();
}
});
}
斯图尔特订单 ts
import { Component, OnInit } from '@angular/core';
import { Validators, FormBuilder, FormGroup, FormControl } from '@angular/forms'
import { HttpClient } from '@angular/common/http';
import { BsModalService, BsModalRef } from 'ngx-bootstrap/modal';
import { BsDatepickerConfig } from 'ngx-bootstrap/datepicker';
import { ApplicationConfiguration } from 'projects/framework/src/lib/ApplicationConfiguration';
import { SharedService } from '../../services/shared.service';
import { EcCommonActionscriptModalComponent } from '../../ec-common/ec-common-actionscript-modal/ec-common-actionscript-modal.component';
import { AlertType, ModalAlert } from 'projects/framework/src/lib/ec-common/ec-common-modal-alert/modal-alert';
import { Alert } from '../../ec-common/ec-common-alert/alert';
import { KeyValue } from '@angular/common';
import { Subject } from 'rxjs';
import { PropertyInfoComponent } from 'projects/ui-app/src/app/pages/property-info/property-info.component';
@Component({
providers: [PropertyInfoComponent],
selector: 'app-stewart-order',
templateUrl: './stewart-order.component.html',
styleUrls: ['./stewart-order.component.css'],
})
export class StewartOrderComponent implements OnInit {
public onClose: Subject<any>;
transactiontype: any;
config: ApplicationConfiguration;
stewartOrderForm: FormGroup;
isFormSubmitted = false;
currentTab = 0;
stewart_forminfo: any;
form_info: any = {};
controlCaptions: any = {};
alert_info: any;
public dpConfig: Partial<BsDatepickerConfig> = new BsDatepickerConfig();
buyersList: any;
fileSeqNbr: string;
buyersTableSettings: any;
showBuyyerForm: boolean;
propertyData: any = {};
disclimer: any;
ID: any;
sellersList: any;
showSellerForm: boolean;
sellersTableSettings: any;
orderSubmitted: boolean;
fundUploadFileUrl: string;
isContactingServer: boolean;
isSubmitting = false;
zipPlaced = "012345678";
constructor(private http: HttpClient,
private modalService: BsModalService,
private sharedService: SharedService,
private propComp: PropertyInfoComponent,
public applicationConfiguration: ApplicationConfiguration,
private fb: FormBuilder,
public modalRef: BsModalRef) {
this.config = applicationConfiguration;
}
ngOnInit() {
this.dpConfig.containerClass = 'theme-dark-blue';
this.dpConfig.showWeekNumbers = false;
this.onClose = new Subject();
this.initForm();
//this.getStewartInfo();
this.fundUploadFileUrl = this.config.data.fundUploadFileUrl;
//this.form_info = this.form_info;
let productGroup = new FormGroup({});
this.form_info.product_types.forEach(product_type => {
if (product_type.allow_multiples) {
for (const product in product_type.products) {
productGroup.addControl(product, new FormControl());
}
}
else {
productGroup.addControl(product_type.name, new FormControl());
}
});
this.stewartOrderForm.addControl('products', productGroup);
// this.stewart_forminfo = this.stewart_forminfo;
//this.stewart_forminfo.needed_by = this.sharedService.formatDate(this.stewart_forminfo.needed_by);
this.stewart_forminfo.needed_by = '';
this.stewart_forminfo.transaction_types = '1';
this.stewartOrderForm.patchValue(this.stewart_forminfo);
this.stewartOrderForm.controls['needed_by'].valueChanges.subscribe(value=>{
this.validateNeedeBy(value);
})
}
selectedTab(index) {
this.currentTab = index;
}
selectTabBtn(index) {
if (!this.onTabChangeBtn()) {
this.currentTab = index;
}
}
onTabChangeBtn() {
switch (this.currentTab) {
case 0:
return this.ValidateGeneralTab();
break;
case 2:
return this.validateIOrderTab();
break;
default:
return '';
break;
}
}
validateNeedeBy(needed_by) {
const initialState = {
message: ''
};
let neededby = new Date(needed_by?needed_by:this.stewartOrderForm.value.needed_by);
let defaultDate = new Date(this.stewart_forminfo.needed_by);
if (neededby < defaultDate) {
initialState.message = initialState.message + ' ' + ' Needed by should be more then 5 days';
}if (initialState.message) {
const alert = new ModalAlert({ message: initialState.message });
alert.type = AlertType.Error;
this.sharedService.addModalAlert(alert);
}
return initialState.message;
}
ValidateGeneralTab() {
const initialState = {
message: ''
};
if (!this.stewartOrderForm.value.transaction_types || !this.stewartOrderForm.value.needed_by) {
initialState.message = initialState.message + ' ' + 'You must select transaction type, product type and Needed by';
}
if (initialState.message) {
const alert = new ModalAlert({ message: initialState.message });
alert.type = AlertType.Error;
this.sharedService.addModalAlert(alert);
}
return initialState.message;
}
validateIOrderTab() {
const initialState = {
message: ''
};
if (!this.stewartOrderForm.value.street_types) {
initialState.message = initialState.message + ' ' + 'You must select street type';
}
if (initialState.message) {
const alert = new ModalAlert({ message: initialState.message });
alert.type = AlertType.Error;
this.sharedService.addModalAlert(alert);
}
return initialState.message;
}
getScannedFiles() {
let data = this.propertyData;
data.file_seq_nbr = this.propertyData.fileSeqNbr
data.company_id = this.propertyData.company_id;
this.http.post(this.config.data.getStewartUrl, data).subscribe((data: any) => {
this.form_info = data.response.form_info;
const save_needed_by = this.stewartOrderForm.value.needed_by;
this.stewartOrderForm.patchValue(this.stewart_forminfo);
this.stewartOrderForm.patchValue({needed_by: save_needed_by});
});
}
onUpload(event) {
this.getScannedFiles();
}
initForm() {
this.isSubmitting = false;
this.stewartOrderForm = this.fb.group({
fileSeqNbr: [this.fileSeqNbr],
transaction_types: ['', Validators.required],
transaction_type: [''],
product_type: ['', Validators.required],
buyer: [''],
seller: [''],
buyer1: [''],
seller1: [''],
lender: [''],
loan_number: [''],
loan_amount: [''],
purchase_price: [''],
street_number: [''],
street_name: [''],
specialinstructions: [''],
unit_number: [''],
parcel_number: [''],
subdivision: [''],
section: [''],
township: [''],
range: [''],
lot: [''],
book: [''],
page: [''],
block: [''],
street_direction_prefixes: [''],
street_direction_suffixes: [''],
unit_types: [''],
street_types: [''],
phase: [''],
acreage: [''],
needed_by: ['', Validators.required],
property_type: [''],
loan_type: [''],
county: [''],
building: [''],
city: [''],
state: [''],
zipcode: [''],
disclaimer_text: [''],
});
this.controlCaptions = {
transaction_type: 'transaction type',
product_type: 'business segment',
need_by: 'needed by',
};
}
isFormValid = false;
validatestewartFrom() {
this.isFormValid = false;
if (this.ValidateGeneralTab()) {
return false;
}
if (this.validateIOrderTab()) {
return false;
}
this.isFormValid = true;
return true;
}
submitOrder() {
this.isFormSubmitted = true;
if (!this.validatestewartFrom()) {
return
}
this.isSubmitting = true;
let data: any =
{
"acreage": "",
"apn": "",
"block": this.stewartOrderForm.value.block,
"book": this.stewartOrderForm.value.bock,
"building": this.stewartOrderForm.value.building,
"county": this.stewartOrderForm.value.county,
"need_by": this.stewartOrderForm.value.needed_by,
"loan_type": this.stewartOrderForm.value.loan_type,
"lot": this.stewartOrderForm.value.lot,
"order_guid": "",
"page": this.stewartOrderForm.value.page,
"phase": this.stewartOrderForm.value.phase,
"prop_city": this.stewartOrderForm.value.city,
"prop_zip": this.stewartOrderForm.value.zipcode,
"property_type": this.stewartOrderForm.value.property_type,
"range": this.stewartOrderForm.value.range,
"searchtype": "",
"section": this.stewartOrderForm.value.section,
"specialinstructions": this.stewartOrderForm.value.specialinstructions,
"state": this.stewartOrderForm.value.state,
"street_direction_prefix": this.stewartOrderForm.value.street_direction_prefixes,
"street_direction_suffix": this.stewartOrderForm.value.street_direction_suffixes,
"street_name": this.stewartOrderForm.value.street_name,
"street_nbr": this.stewartOrderForm.value.street_number,
"street_type": this.stewartOrderForm.value.street_types,
"subdivision": this.stewartOrderForm.value.subdivision,
"township": this.stewartOrderForm.value.township,
"transaction_type": this.stewartOrderForm.value.transaction_types,
"unit_from": "",
"unit_number": this.stewartOrderForm.value.unit_number,
"unit_to": this.stewartOrderForm.value.unit_to,
"unit_type": this.stewartOrderForm.value.unit_types,
"updatenotes": "",
"loan_amount": this.stewartOrderForm.value.loan_amount,
"purchase_price": this.stewartOrderForm.value.purchase_price,
"lender": this.stewartOrderForm.value.lender,
"loan_number": this.stewartOrderForm.value.loan_number
}
let products = [];
for (const key in this.stewartOrderForm.value.products) {
if (Object.prototype.hasOwnProperty.call(this.stewartOrderForm.value.products, key)) {
if (this.stewartOrderForm.value.products[key]) { // Could be null if no product of this sort selected
products.push(this.stewartOrderForm.value.products[key]);
}
}
}
data.product = products.join(',')
data.saved_documents = this.form_info.scanned_files.filter(file => {
return file.isChecked
}).map(file => {
return file.key
}).join('|');
data.borrowers = this.form_info.borrowers;
data.sellers = this.form_info.sellers;
this.http.post(this.form_info.submit_link, data).subscribe((data: any) => {
if (data.meta.status != 'SUCCESS') {
let alert = new Alert({ message: data.meta.status_message });
alert.type = AlertType.Error
this.sharedService.addAllert(alert);
}
else {
let alert = new Alert({ message: data.meta.status_message });
alert.type = AlertType.Success
this.sharedService.addAllert(alert);
}
// window.location.reload();
this.propComp.reloadStewart();
// this.propComp.ngOnInit();
// this.propComp.reloadData();
// this.addData(data);
// this.onClose.next(this.form_info);
this.modalRef.hide();
});
}
// public data = [];
// addData(data){
// this.data.push(data);
// }
// Need to display some lists alphabetically by the display vvlue
alphaByValue = (a: KeyValue<number,string>, b: KeyValue<number,string>): number => {
return a.value.localeCompare(b.value);
}
}
我能够通过利用数据绑定并通过将数据从模块传回外部组件来推送到数组来解决这个问题：
我添加的创建订单按钮：
(onNewOrders)="addNewStewartOrders($event)"
方法在模块关闭后命中
addNewStewartOrders(event){
this.stewartorders.push.apply(this.stewartorders, event);
}
从模态返回命令按钮组件：
this.modalRef.content.onClose.subscribe((newOrders:any) => {
console.log(newOrders, 'newOrders STEWART')
this.onNewOrders.emit(newOrders);
});
this.onClose.next(data.response.orders);