html - 如何有一个角度对话框的输出来告诉父母一些事情

Question

这是我选择要编辑的内容并且它处于活动状态时的第一张照片 这是第二张带有已编辑的第二个对象的照片，现在它已被选中，但它是最后一个被选中的。
我有一个 Angular 对话框，我可以传递数据和所有内容，但问题是这样。当我打开带有 id 的选定对象的对话框时，它处于活动状态并且正在工作，但是当我再次打开带有另一个 id 的另一个对象的对话框时，它们都保持活动状态，因此对于每个对象来说，这是任何可能的way to give a command when click cancel or save the dialog will reset the selected object id and when another one is selected only this should be active.

这是我的代码。

<div class="dropdown-menu-item" (click)="openValueItemEditDialog({valueItem: valueItem})">{{'button.#edit'|translate}}</div>
<div [class]="'name-block name-block-width-' + valueItem.level" [ngClass]="{'active': activeSelected === valueItem.id, 'critical': (impactanalyse$ | async) && valueItem.accumulatedImpact === 2 && valueItem.level !== 1, 'semi-critical': (impactanalyse$ | async) && valueItem.accumulatedImpact === 1 && valueItem.level !== 1, 'not-critical': (impactanalyse$ | async) && valueItem.accumulatedImpact === 0 && valueItem.level !== 1, 'selected-critical': (impactanalyse$ | async) && valueItem.level === 1}"
     (click)="setAllChildren()">

.name-block {
    @extend %common-block;
    @include center(false, true);
    @include justify-content(space-between);
    margin-left: 1px;
    padding-left: 10px;

    &.active {
      z-index: 1950 !important;
    }

activeSelected: any = '';

openValueItemEditDialog(editOptions: EditOptions) {
        if (editOptions.valueItem) {
            this.store.dispatch(new SelectEditedViAction(editOptions.valueItem.id));
        }
        this.activeSelected = editOptions.valueItem.id;
        this.dialog.open(ValueItemEditDialogComponent, { data: editOptions, disableClose: false });
    }

这是对话框

<mat-dialog-actions fxLayout="row" fxLayoutGap="10px" fxLayoutAlign="end end" style="margin-right: 37px">
        <button *ngIf="!editOptions.planning && editedValueItem.technicalState == 0" (click)="save()" mat-dialog-close>Save</button>
        <button mat-dialog-close>Cancel</button>
@Input() activeSelected: boolean
@Output() activeSelectedChange = new EventEmitter<boolean>()

save() {
        this.activeSelectedChange.emit(false);

标签： htmlcssangulartypescript