Angular UI Bootstrap - ich kann öffnen und schließen eines modalen nur einmal

Ich habe ein seltsames problem mit einem modal. Es sollte eine ganz normale modale, die ich öffnen kann und in der Nähe viele Male, aber kann ich öffnen nur eine und auch nur in der Nähe einer Zeit! http://plnkr.co/ksTy0HdifAJDhDf4jcNr

Meine index.html - Datei folgendermaßen Aussehen:

<body ng-controller="MainCtrl">
  <div ng-include src="'widget.html'" ng-controller="WidgetCtrl"></div>
  <!-- other widgets and content -->
</body>

Wie Sie sehen können, habe ich so aufgeteilt, daß meine Bewerbung in verschiedene Teile (sogenannte widgets), ich bin auch pro ng-include in meine index-html-Datei. Jedes widget hat seinen eigenen controller.

Den widget.html sieht wie folgt aus:

<div modal="theModal">
    <div class="modal-header"><h3>The Modal</h3></div>
    <div class="modal-body">
      Body intentionally left blank
    </div>
    <div class="modal-footer">
        <button class="btn" type="button" ng-click="CloseModal()">ok</button>
    </div>
</div>
<!-- more modals and other stuff -->
<button ng-click="OpenModal()">open modal</button>

Und jetzt die widget-controller (das ist ein Kind regler der main-controller)

app.controller('WidgetCtrl', function ($scope) {
  $scope.OpenModal  = function() { $scope.theModal = true; }
  $scope.CloseModal = function() { $scope.theModal = false;}
});

Sind alles Sachen, die für das öffnen und schließen des modal ist Teil der sub-controller (WidgetCtrl) und sollte daher nicht in Konflikt mit allem, was von der übergeordneten Steuerung.

$scope.theModal ist am Anfang undefined, so das modal ist, nicht angezeigt. Mit einem Klick auf die Schaltfläche $scope.theModal definiert und festgelegt true; diese wird ausgelöst durch Angular UI und der modal angezeigt wird. Auf einen Klick auf ok, werden die jetzt bestehenden $scope.theModal eingestellt ist false und der modal verschwindet. Alles ist perfekt, aber .. es ist nicht wieder arbeiten!

  • Dein link lädt nicht für mich, aber sollte nicht die erste Zeile des widgets werden <div ng-show="theModal">?
  • Hi Jim, Plnkr ist ein bisschen langsam heute. Ich denke, Sie haben performance-Probleme. 🙁 Ich bin mit der Angular-UI-bootstrap. Daher das Attribut modal korrekt ist.
InformationsquelleAutor kwrl | 2013-05-06
Schreibe einen Kommentar