Angular 7：你想在ts文件中隐藏一个模态吗？

Question

我需要在编辑表单后隐藏模态。如何在ts文件中添加模态消除。当我使用数据解除保存按钮时模态解除但保存操作不起作用。

 <div class="modal fade" id="editExperienceModal" tabindex="-1" 
        role="dialog" aria-labelledby="myModalLabel"
          aria-hidden="true">
          <div class="listing-modal-2 modal-dialog">

            <div class="submit_listing_box">
              <h3>Experience</h3>
              <form #f="ngForm"  class="form-alt" (ngSubmit)=editExperience()>
                <div class="row">

                  <div class="form-group col-md-6 col-sm-12 col-xs-12">
                    <label>Intitulé du poste </label>
                    <input class="form-control" name="titre" [(ngModel)]="exp.titre" type="text" #titre="ngModel">
                  </div>

                  <div class="form-group col-md-6 col-sm-12 col-xs-12">
                    <label> Entreprise </label>
                    <input class="form-control" name="organisation" [(ngModel)]="exp.organisation" #organisation="ngModel"
                      type="text">
                  </div> 
                <div class="vfx-price-btn">
         <button type="submit" class="purchase-btn pull-right">  
              Save</button>
                </div>
              </form>
            </div>
          </div>
        </div>

Answer 1

• 将您的buttontype从type =“submit”更改为type =“button”
• 调用你的函数editExperience（），同时调用“dismiss-modal”。这样你就可以解除模态和调用功能。希望这可以帮到你。

这是一个例子：

 <div class="modal fade" id="editExperienceModal" tabindex="-1" 
            role="dialog" aria-labelledby="myModalLabel"
              aria-hidden="true">
              <div class="listing-modal-2 modal-dialog">

                <div class="submit_listing_box">
                  <h3>Experience</h3>
                  <form #f="ngForm"  class="form-alt" (ngSubmit)=editExperience()>
                    <div class="row">

                      <div class="form-group col-md-6 col-sm-12 col-xs-12">
                        <label>Intitulé du poste </label>
                        <input class="form-control" name="titre" [(ngModel)]="exp.titre" type="text" #titre="ngModel">
                      </div>

                      <div class="form-group col-md-6 col-sm-12 col-xs-12">
                        <label> Entreprise </label>
                        <input class="form-control" name="organisation" [(ngModel)]="exp.organisation" #organisation="ngModel"
                          type="text">
                      </div> 
                    <div class="vfx-price-btn">
             <button type="button" (click)="editExperience()"  data-dismiss="editExperienceModal" class="purchase-btn pull-right">  
                  Save</button>
                    </div>
                  </form>
                </div>
              </div>
            </div>