NG-Bootstrap - Dropdown -选择值

Question

我目前正在为我的Electron App的下拉菜单使用以下代码：

 <div class="row">
                    <div class="col">
                        <div ngbDropdown class="d-inline-block">
                            <button class="btn btn-outline-primary" id="dropdownBasic1" ngbDropdownToggle>Selected Value</button>
                            <div ngbDropdownMenu aria-labelledby="dropdownBasic1">
                                <button class="dropdown-item">Example A</button>
                                <button class="dropdown-item">Example B</button>
                                <button class="dropdown-item">Example C</button>
                            </div>
                        </div>
                    </div>
                </div>

我在这里找到的：https://ng-bootstrap.github.io/#/components/dropdown/examples

我想要的是，如果我单击示例A，我希望它显示为选定的值。因此，不是“选定值”，而是“示例A”。

Answer 1

为此，您可以使用字符串插值。在TS文件中，您可以执行以下操作：

selectedValue: string = 'Selected Value';

在HTML文件中，您可以执行以下操作：

<button class="btn btn-outline-primary" id="dropdownBasic1" ngbDropdownToggle>{{selectedValue}}</button>

和

<button class="dropdown-item" (click)="changeDropdownName('Example A')">Example A</button>

然后将changeDropdownName函数添加到TS文件中：

changeDropdownName(value: string) {
this.selectedValue = value;
}