2016-06-14 21 views
1

我正在學習角度js,我試圖加載一個錯誤模態,只要在休息調用期間發生任何錯誤。未調用模態控制器

下面是我的模態

<div class="modal-header"> 
    <h1>This is the title</h1> 
</div>' 
<div class="modal-body"> 
    {{errormessage}} 
</div> 

下面是我的父控制器在其下我定義的錯誤條件

angular.module('ui.bootstrap.demo').controller('CarouselDemoCtrl', function ($scope, $http, dataShare, $uibModal) { 
    $scope.myInterval = 5000; 
    $scope.noWrapSlides = false; 
    $scope.active = 0; 
    var slides = $scope.slides = []; 
    var currIndex = 0; 

    $scope.sendEnvName = function(data) { 
     dataShare.sendEnvDetails(data); 

     window.location.href = "query/queryboard.html"; 
    } 

    $scope.addSlide = function (envName) { 
     slides.push({ 
      text: envName, 
      id: currIndex++ 
     }); 
    }; 

    $http.get("http://localhost:8080/getEnvList") 
     .success(function (data) { 
      for (var i in data) { 
       $scope.addSlide(data[i].envName); 
      } 
     }) 
     .error(function (error) { 
      $uibModal.open({ 
       templateUrl: 'error/ErrorModal.html', 
       controller: ErrModalInstanceCtrl, 
       size: 'sm', 
       resolve:{ 
        errormessage: function() { 
         console.log('lllllllllllll') 
         return "Some error occured"; 
        } 
       } 
      }); 

      var ErrModalInstanceCtrl = function ($scope, $uibModalInstance, errormessage) { 
       console.log(errormessage) 
       $scope.items = items; 

      }; 
     }); 

}); 

如果我不使用解決或控制,也就是我硬編碼的一些字符串錯誤消息佔位符的地方,模式加載完美。我GOOGLE了我發現關於把控制器放在引號中的不同答案,但這也沒有幫助。

請幫我一下,不知道我哪裏出錯了。

+1

嘗試註冊您的模態控制器。像這樣:'angular.module('ui.bootstrap.demo').controller('ErrModalInstanceCtrl',ErrModalInstanceCtrl);'然後將'ErrModalInstanceCtrl'作爲字符串傳遞給'controller:'選項。 (將控制器註冊到當前控制器'CarouselDemoCtrl'之外) –

+0

關注[this plunker](http://plnkr.co/edit/9FyyOlJSj2XPAD0aax5Z)並告訴我它是否適用於您的情況。 –

+1

@GabrielHobold ...它在CarouselDemoCtrl之外聲明時工作,這是否意味着角度我們不能嵌套控制器? –

回答

1

您必須在當前控制器外部註冊模態控制器,然後將該名稱傳遞給$uibModal.open方法中的controller屬性。

像這樣:

// REGISTER THE MODAL CONTROLLER HERE 
angular.module('ui.bootstrap.demo').controller('ModalInstanceCtrl', ModalInstanceCtrl); 
ModalInstanceCtrl.$inject = ['$scope', '$uibModalInstance']; 
function ModalInstanceCtrl($scope, $uibModalInstance) { 

    $scope.item = "I'm your item"; 

    $scope.ok = function() { 
     $uibModalInstance.close(); 
    }; 

    $scope.cancel = function() { 
     $uibModalInstance.dismiss('cancel'); 
    }; 
} 

你的控制器:

var modalInstance = $uibModal.open({ 
     animation: true, 
     templateUrl: 'myModalContent.html', 
     controller: 'ModalInstanceCtrl', // The modal controller name ('ModalInstanceCtrl') 
     size: size, 
     resolve: { 
      errormessage: function() { 
       console.log('lllllllllllll') 
       return "Some error occured"; 
      } 
     } 
    }); 

Plunker here

相關問題