Question

In this plunk我有一个Angular UI模式，当打开时，它应隐藏一秒然后显示。我在模板本身使用ng-show，但隐藏了内容，而不是模态。如何隐藏模态？请注意，模式会在console.log("opened")之后显示，而不会等待console.log("displayed")。

使用Javascript：

var app = angular.module('app', ['ui.bootstrap']);
app.controller('ctl', function () {});

app.directive("theModal", function($uibModal,$timeout) {
          return {
            restrict: "AE",        
            link: function (scope, element, attrs) {

                    scope.show = false;
                    console.log("opened");
                    scope.instance = $uibModal.open({
                        windowClass: 'app-modal',
                        template: '<div ng-show="show">MODAL WAS LOADED</div>'
                    });

                    $timeout(function(){
                      scope.show = true;
                      console.log("displayed");
                    },1000)

            }
        }
    });

Answer 1

试试这个

var app = angular.module('app', ['ui.bootstrap']);
app.controller('ctl', function () {});

app.directive("theModal", function($uibModal,$timeout) {
      return {
        restrict: "AE",        
        link: function (scope, element, attrs) {

                console.log("opened");

                $timeout(function(){
                  scope.instance = $uibModal.open({
                    windowClass: 'app-modal',
                    template: '<div >MODAL WAS LOADED</div>'
                  });
                  console.log("displayed");
                },1000)

        }
    }
});

打开后一秒显示Angular UI Modal

1 个答案: