AngularUI Modal控制器錯誤

這是我第一次嘗試AngularUI Modal。AngularUI Modal控制器錯誤

有一個不斷的錯誤：controller as vm是不是一個函數，得到了undefined。

這裏是我的部分：

<div class="container" ng-controller="controller as vm"> 
<script type="text/ng-template" id="hello.html"> 
    <div class="modal-header"> 
    <h3 class="modal-title" id="modal-title">I'm a modal!</h3> 
    </div> 
    <div class="modal-body" id="modal-body"> 
    hello 
    </div> 
    <div class="modal-footer"> 
    <button class="btn btn-primary" type="button" ng-click="vm.ok()">OK</button> 
    <button class="btn btn-warning" type="button" ng-click="vm.cancel()">Cancel</button> 
    </div> 
</script> 

<button type="button" class="btn btn-default" ng-click="vm.open()">Open me!</button>

控制器：

app.controller('controller',[function($uibModal,$log) 
{ 
var vm = this; 
vm.animationsEnabled = true; 

vm.open = function() { 
var modalInstance = $uibModal.open({ 
    animation: vm.animationsEnabled, 
    ariaLabelledBy: 'modal-title', 
    ariaDescribedBy: 'modal-body', 
    templateUrl: 'hello.html', 
    controller: 'Modalcontroller', 
    //controllerAs: 'vm', 


    }) 
}; 
}]);

app.js

var app=angular.module("myapp",['ui.router', 'ui.bootstrap']); 

... 

    .state("user", { 
    url: "/user", 
    views: { 
     "main": { 
     templateUrl: "partials/user.html", 
     controller: "controller", 
     controllerAs: "vm", 
     } 
    } 
});

來源

2016-08-25 uttejh

你使用哪個版本的角？爲什麼你在封閉的頁面視圖中使用相同的控制器，以及模態？這沒有什麼意義。另外，由於控制器已經在狀態定義中指定，因此在視圖中再次指定它將創建兩個實例，而不是一個。從視圖中刪除它。 –

我正在使用angular 1.5，並按照您的說法進行相應編輯。 – uttejh

用'function（$ uibModal，$ log）'或'['$ uibModal'，'$ log'替換'[function（$ uibModal，$ log）''功能（$ uibModal，$日誌）'。如果你需要縮小的話，最好是第一個，並且使用ng-annotate在構建期間自動轉換爲第二個表單。 –

我創建了plunkr。請看看

(https://plnkr.co/edit/6fx26BVrXu0ud8TkvrMq?p=preview) 

myApp.controller('ModalController', ['$scope', '$uibModalInstance', '$uibModal', '$state', function($scope, $uibModalInstance, $uibModal, $state) { 
     var self = this; 
     self.cancel = function(){ 
      $uibModalInstance.dismiss(); 
     }; 

    }]); 
    myApp.controller('userController', ['$scope', '$uibModal', '$state', function($scope, $uibModal, $state) { 
     var self = this; 
     self.animationsEnabled = true; 

     self.open = function(){ 

     var modalInstance = $uibModal.open({ 
       animation: self.animationsEnabled, 
       ariaLabelledBy: 'modal-title', 
       ariaDescribedBy: 'modal-body', 
       templateUrl: 'hello.html', 
       controller: 'ModalController', 
       controllerAs: 'vm' 

      }); 
     }; 
    }]);

來源

2016-08-25 12:34:36

AngularUI Modal控制器錯誤

回答

相關問題