Detailliertes Beispiel für die Verwendung der modalen Box ngModal in AngularJS

Dieser Artikel stellt hauptsächlich das Beispiel der Verwendung der ngModal-Modalbox in JS vor. Jetzt werde ich es mit Ihnen teilen und es als Referenz. Folgen wir dem Editor und werfen wir einen Blick darauf.

Die Verwendung modaler Boxen in AngularJS erfordert

die Referenzierung von Dateien:

1. angular.js 1.5.5

2. ui.

   bootstrap-tpls.js 0.11.2

3. bootstrap.css 3.3.7

Sie müssen darauf achten, dass die Version konsistent ist. Höhere Versionen unterstützen diese Methode nicht und es treten Fehler auf.

Schreiben Sie den Inhalt des Modalfelds, das angezeigt werden soll Geben Sie im Skript-Tag

Attribute an, die auf der Seite platziert werden sollen 🎜> um den Anzeigemodus Statusfeld auszulösen

<script type="text/ng-template" id="modal.html"> 
<p>
  <p class="modal-header">
    <h3 class="modal-title" align="center">
      标题信息
    </h3>
  </p>
  <p class="modal-body">
    <p align="center">
      模态框内容
    </p>
  </p>
  <p class="modal-footer">
    <button class="btn btn-primary" ng-click="ok()">
      确认
    </button>
    <button class="btn btn-warning" ng-click="cancel()">
      退出
    </button>
  </p>
</p>
</script>

html

Das obige ist der detaillierte Inhalt vonDetailliertes Beispiel für die Verwendung der modalen Box ngModal in AngularJS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!