Question

我有一个由父母用ngFor生成n次的选择组件（组合框）。

<myComponent *ngFor="let dropdown_element of dropdown_menu" [disable_flag]="dropdown_element.isDisabled"></myComponent>

将@Input disable_flag设置为＆＃39; false＆＃39;我初始化为三个元素中的两个元素。

我想更改＆＃39; true＆＃39;选择已启用的选项后。

Answer 1

您可以在组件MyComponent中设置一个Output，以告诉父组件应该启用哪个下拉元素。

希望下面的代码可以帮助您实现这一目标：

＆＃13;

// Parent component:

<myComponent *ngFor="let dropdown_element of dropdown_menu" [dropdownElement]="dropdown_element" (enableEl)="enableElement($event)"></myComponent>


export class ParentComponent {
    dropdown_menu = [ ... ];
    enableElement(element): void {
        dropdown_menu.forEach(el => {
            if (el.id === element.id) {
                el.isDisabled = false;
            } else {
                el.isDisabled = true;
            }
        });
    } 
}

// Child component:

import { Component, Output, EventEmitter } from '@angular/core';

@Component({
    selector: 'myComponent',
    //...
})
export class MyComponent {

    @Output() enableEl = new EventEmitter<any>();
    @Input() dropdownElement;
	
    enable():void {
        this.enableEl.emit(dropdownElement);
    }	
}

＆＃13;

如何从兄弟节点开始更改组件的@Input值

1 个答案: