Question

我希望能够在页面加载后立即看到模式打开。我看到灰色的模态背景，但是模态本身不见了。

这是我的html：

<div id="content-container">
  <div class="content">
    <div class="row">
      <div class="column" style="background-color: #EFF3F6;"> <h1 class = "pageTitle">Welcome!</h1>

        <div>
          <button [routerLink]="['/myPendingRequests']">Enter ePACS</button>
        </div>
      </div>
    </div>
    <div id="skipContent" tabindex=”-1″>
    </div>
  </div>
</div>
<button id="openModal" #openModal [hidden]="true" 
 data-toggle="modal" data-target="#openModal"></button>

相同组件中的模态：

  <!-- Remove Modal -->
  <div class="openModal">
    <div class="modal left fade" id="openModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" data-backdrop="static">
        <div class="modal-dialog" role="document">
          <div class="modal-content" id="whiteColor">

              <div class="modal-header">
                <p> This is my modal</p>
              </div>

              <div class="modal-body">
              </div>
          </div>
        </div>
      </div>
  </div>

谢谢！

Answer 1

这可以通过以下简单的方法实现：

<div class="modal show" id="myModal" role="dialog" data-backdrop="static">
 <div class="modal-dialog">
    <div class="modal-content">
    <div class="modal-header">
      <h4 class="modal-title">Title of my Modal</h4>
    </div>
    <div class="modal-body">
       <p> Here is some text for the modal </p>
      <div class="buttonSelect">
        <button id="cancelConsentButton" class="btn btn success" onclick = "$('.modal').removeClass('show').addClass('fade');">Cancel</button>
        <button id="acceptConsentButton" class="btn btn success" onclick = "$('.modal').removeClass('show').addClass('fade');">I Agree</button>
      </div>

    </div>
</div>

打开页面加载模式Angular4

1 个答案: