Html 被动表单，唯一触发三次单击事件。1.提交表单2.从下拉列表3发送数据。和两个一样，以相同的反应形式

我写了一份反应式表格。提交按钮应该在被动表单的外部。它还有两个下拉列表。在这种形式下，我从api动态读取数据。我也在下拉列表中编写了单击事件（目的是在提交表单时绑定该特定值）。这里的问题是，每当我点击下拉列表…提交按钮点击事件被触发…我一直试图使它们（三次点击事件）是唯一的…但我无法。。。。请帮帮我。下面我提供我的代码

    <div class="container content-box-shadow tiles-top-spacing tiles-page">
    <div class="row assessment-m-b">
        <div class="col-lg-12 col-md-12 pt-3 pb-5">
            <div class="d-flex align-items-center justify-content-between">
                <span class="common-headding">{{pageText?.accountSettingPageTextData?.editHeader}}</span>
                <div>
                    <button type="submit" class="common-button green"
                        (click)="onSubmit()">{{pageText?.accountSettingPageTextData?.save}}</button>
                    <button type="button"
                        class="common-button orange" (click)="previousModule()">{{pageText?.accountSettingPageTextData?.cancel}}</button>
                </div>
            </div>

            <div class="account-settings-block">
                <form *ngIf="personalData" [formGroup]="accountSettingsForm" >..................................................

                    <!-- Account-Settings Security Questions -->
                    <div *ngIf=" personalData?.dashBoardPersonalInfoData?.securityQuestionsAnswers.isVisible"
                        class="account-form-inner-block">
                        <legend>{{pageText?.accountSettingPageTextData?.questions?.header}}<span class="required">**</span></legend>
                        <div class="row">

                            <div class="col-md-6">
                                <div>
                                    <label for="question1">
                                        {{pageText?.accountSettingPageTextData?.questions?.question1}}
                                    </label>
                                    <div class="btn-group w-100 pt-1" ngbDropdown>

                                        <button class="btn btn-secondary dropdown-toggle w-100 text-left"
                                            aria-haspopup="true" aria-expanded="false" id="dropdownMenu1"
                                            ngbDropdownToggle>
                                            <span *ngIf="!SecurityQuestion1.question">
                                                Select a Question
                                            </span>
                                            <span *ngIf="SecurityQuestion1.question">
                                                {{SecurityQuestion1.question}}
                                            </span>
                                        </button>
                                        <div class="dropdown-menu dropdown-menu-left" aria-labelledby="dropdownMenu">
                                            <button (click)="selectQuestion1(questions)"
                                                *ngFor="let questions of personalData?.dashBoardPersonalInfoData?.securityQuestions"
                                                class="dropdown-item">{{questions?.question}}
                                            </button>
                                        </div>
                                    </div>
                                </div>
                                <div>

                                    </div>


                                </div>
                            </div>
                            <div class="col-md-6">
                                <div>
                                    <label for="question2">
                                        {{pageText?.accountSettingPageTextData?.questions?.question2}}
                                    </label>
                                    <div class="btn-group w-100 pt-1" ngbDropdown>
                                        <button class="btn btn-secondary dropdown-toggle w-100 text-left"
                                            aria-haspopup="true" aria-expanded="false" id="dropdownMenu2"
                                            ngbDropdownToggle>
                                            <span *ngIf="!SecurityQuestion2.question">
                                                Select a Question
                                            </span>
                                            <span *ngIf="SecurityQuestion2.question">
                                                {{SecurityQuestion2.question}}
                                            </span>
                                        </button>
                                        <div class="dropdown-menu dropdown-menu-left" aria-labelledby="dropdownMenu">
                                            <button (click)="selectQuestion2(questions)"
                                                *ngFor="let questions of personalData?.dashBoardPersonalInfoData?.securityQuestions"
                                                class="dropdown-item">{{questions?.question}}
                                            </button>
                                        </div>
                                    </div>
                                </div>


                                </div>
                            </div>
                        </div>
                    </div>

                </form>
            </div>
        </div>
    </div>
</div>

{{pageText？.accountSettingPageTextData？.editHeader}}
{{pageText？.accountSettingPageTextData？.save}
{{pageText？.accountSettingPageTextData？.cancel}
..................................................
{{pageText？.accountSettingPageTextData？.questions？.header}**
{{pageText？.accountSettingPageTextData？.questions？.question1}
选择一个问题
{{安全问题1.问题}
{{问题？.问题}
{{pageText？.accountSettingPageTextData？.questions？.question2}
选择一个问题
{{安全问题2.问题}
{{问题？.问题}

我可以通过使用保存按钮中的form=“myForm”属性来解决上述问题。在表单标签中使用id=“myForm”属性……只需使用这些属性……我就可以为所有三个事件设置唯一的触发器……我仍然会保持状态，这样人们就不必花费近4小时或更长的时间来找到它……

我可以通过在保存按钮中使用form=“myForm”属性来解决上述问题。在表单标签中使用id=“myForm”属性……只要使用这些属性……我就可以为所有这三个事件设置唯一的触发器……我仍然会保持状态，这样人们就不必浪费近4小时或更长的时间来查找它