Question

这是我第一次尝试使用AngularUI Modal。

有一个常数错误：controller as vm不是函数，未定义。

这是我的偏爱：

<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",
      }
    }
});

Answer 1

我创造了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'

          });
        };
    }]);

AngularUI模态控制器错误

1 个答案: