角引導模式控制器不起作用

Question

我有一個角度的應用程序，顯示模式對話框，我無法獲得控制器的功能工作。這裏是我的應用程序定義：

var deps = ['ngResource', 'ngRoute', 'swaggerUi', 'http-auth-interceptor', 'ngAnimate', 'angular-spinkit', 'ui.bootstrap']; 
var myapp = angular.module('myApp', deps); 

這裏是我的控制器調用模式，並結合到模態

myapp.controller('UsersController', ['$scope', '$log', '$uibModal', 'UsersService', function ($scope, $log, $uibModal, UsersService) { 
    $scope.users = UsersService.getAll(); 
    $scope.openAddUserModal = function() { 
     $uibModal.open({ 
      animation: false, 
      templateUrl: 'partials/addUserModal.html', 
      /* I've even tried controller:'AddUserModalCtrl as addUserModalCtrl' */ 
      controller: 'AddUserModalCtrl', 
      controllerAs: 'addUserModalCtrl', 
      bindToController: true 
     }); 
    }; 
}]).controller('AddUserModalCtrl', ['$scope', '$log', '$uibModalInstance', function ($scope, $log, $uibModalInstance) { 
    $scope.cancel = function() { 
     console.log('userToAdd: ' + JSON.stringify($scope.userToAdd)); 
     $uibModalInstance.dismiss('cancel'); 
    }; 
    $scope.addUser = function() { 
     console.log($scope.username); 
    } 
}]) 

這裏控制器的HTML模式：

<div class="modal-header"> 
    <h3 class="modal-title">Add new user</h3> 
</div> 
<div class="modal-body"> 
    <form role="form"> 
     <button ng-click="addUser()" type="submit" class="btn btn-default">Submit</button> 
     <!-- this works if I remove the 'addUserModalCtrl' --> 
     <button ng-click="addUserModalCtrl.cancel()" type="submit" class="btn btn-default">Cancel</button> 
    </form> 
</div> 

Answer 1

這是因爲您正在將方法添加到$scope。在使用controllerAs語法時，你不這樣做。您應該在AddUserModalCtrl中爲您的功能使用this.表示法。

this.cancel = function() { 
    console.log('userToAdd: ' + JSON.stringify(this.userToAdd)); 
    $uibModalInstance.dismiss('cancel'); 
}; 
this.addUser = function() { 
    console.log(this.username); 
}