long story short, i have custom dialog component that takes three inputs to display data. example showing here only use a static component and injected to parent component. i wonder if there is away i can pass inputs to component other than the traditional way. my whole point is, i do not want to create 10 components has the same structure, other than create one component that takes inputs with different values
here is the component i was talking about :
import { Model } from '../models/modal';
import { MdDialogRef, MdDialog, MdDialogConfig } from '@angular/material';
export interface ImgTypes{
bar?:string;
dot?:string;
line?:string;
}
export interface Images{
linear?: ImgTypes;
ridge?: ImgTypes;
ridgeCv?: ImgTypes;
lasso?: ImgTypes;
lassoCv?: ImgTypes;
}
@Component({
selector: 'app-dialog',
templateUrl: './dialog.component.html',
})
export class DialogComponent {
images: Images;
calculatedModal;
variables;
constructor(public dialogRef: MdDialogRef<DialogComponent>) {
}
}
@Component({
selector: 'app-view-modal',
templateUrl: './view-modal.component.html',
styleUrls: ['./view-modal.component.css']
})
export class ViewModalComponent implements OnInit {
@Input() calculatedModal;
@Input() options;
@Input() images: Images;
dialogRef: MdDialogRef<DialogComponent>;
model: Model = {
AdmitSource: 0, AdmitUnit: 0, DischargeDisposition: 0, icuOrder: 0, PrimaryInsurance: 0,
age: 0, generalCareOrder: 0, stepdownOrder: 0, isoResult: 0
};
variables = [
'Admit_Source',
'Primary_Insurance',
'Discharge_Disposition',
'Admit_Unit',
'Bed_Category',
'iso_result',
'icu_order',
'stepdown_order',
'age'];
ngOnInit() {
}
constructor(public dialog: MdDialog, public viewContainerRef: ViewContainerRef) {
}
openDialog() {
let config = new MdDialogConfig();
config.viewContainerRef = this.viewContainerRef;
if (this.calculatedModal && this.images) {
this.dialogRef = this.dialog.open(DialogComponent, config);
this.dialogRef.componentInstance.images = this.images ;
this.dialogRef.componentInstance.calculatedModal = this.calculatedModal ;
this.dialogRef.componentInstance.variables = this.variables;
this.dialogRef.afterClosed().subscribe(result => {
this.dialogRef = null;
});
}
}
};