模态状态角度

Question

我想使用ui-router.I设置模式状态。我使状态：

.state('adminUsers.new', {
                url: '/new',
                controller: 'adminUsersCtrl',
                onEnter: ['$uibModal', '$state', function($uibModal, $state){
                    $uibModal.open({templateUrl: "administration/users/new.html"})
                        .result.then(
                            function(){
                                $state.go('^');
                            },
                            function(){
                                $state.go('adminUsers');
                            },
                            function(){
                                $state.go('adminUsers');
                            }
                    ).finally(function(){$state.go('^')});
                }]
            })

当我进入adminUsers.new状态时，模板正常加载并显示。在模板中，我有两个按钮：

<span class="btn btn-success" ng-click="addUser()">Add user</span>
<a class="btn btn-danger" ui-sref="adminUsers" href="#/admin/users">Cancel</a>

adminUsersController

var adminUsersController = function($scope, Restangular, $stateParams, $state) {
    $scope.store = Restangular.all('users');
    console.log("adminUsersController");
    $scope.store
        .getList()
        .then(
            function(users){
                $scope.users = users;
            },
            function()
            {
                alertify.log("Не удалось получить список пользователей");
            }
        )
    $scope.addUser = function() {
        alert('hello');
    }
};

angular
    .module('mofs')
    .controller('adminUsersCtrl', [
        '$scope',
        'Restangular',
        '$stateParams',
        '$state',
        adminUsersController
    ]);

当我点击"addUser“按钮时，我没有收到警告，但当我点击"cancel”按钮时，模式窗口并没有关闭，但在浏览器中，url变成了#/admin/users。我做错了什么？谢谢。完整的模板代码

<div class="modal-content" uib-modal-transclude=""><div class="row no-margin ng-scope">
  <h3>
    Новый пользователь
  </h3>
  <form class="form-horizontal ng-pristine ng-valid" id="userForm">
    <div class="form-group">
      <label class="col-sm-3 control-label" for="user[surname]">
        Фамилия
      </label>
      <div class="col-sm-9">
        <input class="form-control" id="user[surname]" name="user[surname]" type="text">
      </div>
    </div>
    <div class="form-group">
      <label class="col-sm-3 control-label" for="user[name]">
        Имя
      </label>
      <div class="col-sm-9">
        <input class="form-control" id="user[name]" name="user[name]" type="text">
      </div>
    </div>
    <div class="form-group">
      <label class="col-sm-3 control-label" for="user[patronimyc]">
        Отчество
      </label>
      <div class="col-sm-9">
        <input class="form-control" id="user[patronimyc]" name="user[patronimyc]" type="text">
      </div>
    </div>
    <div class="form-group">
      <label class="col-sm-3 control-label" for="user[login]">
        Логин
      </label>
      <div class="col-sm-9">
        <input class="form-control" id="user[login]" name="user[login]" type="password">
      </div>
    </div>
    <div class="form-group">
      <label class="col-sm-3 control-label" for="user[password]">
        Пароль
      </label>
      <div class="col-sm-9">
        <input class="form-control" id="user[password]" name="user[password]" type="password">
      </div>
    </div>
    <div class="form-group">
      <label class="col-sm-3 control-label" for="user[password_confirmation]">
        Подтверждение пароля
      </label>
      <div class="col-sm-9">
        <input class="form-control" id="user[password_confirmation]" name="user[password_confirmation]" type="password">
      </div>
    </div>
    <div class="form-group">
      <label class="col-sm-3 control-label" for="user[role]">
        Роль
      </label>
      <div class="col-sm-9">
        <select class="form-control" id="user[role]" name="user[role]">
          <option value="1">Администратор</option>
          <option value="2">Главный врач</option>
          <option value="3">Врач</option>
          <option value="4">Сотрудник регистратуры</option>
        </select>
      </div>
    </div>
  </form>
</div>
<div class="row no-margin ng-scope">
  <div class="pull-right">
    <span class="btn btn-success" ng-click="addUser()">Добавить</span>
    <a class="btn btn-danger" ui-sref="adminUsers" href="#/admin/users">Отменить</a>
  </div>
</div></div>

Answer 1

除了teplateUrl，您还可以将controller作为property.Like作为fallows提供

$uibModal.open({
                 animation: true,
                 templateUrl: 'Your template URL',
                 controller: 'Your controller',
                    size: undefined,
                    resolve : {
                     // If you have anything to resolve 
                        embedLink : function (){
                            return embedLink;
                        }
                    }
                });

在您的controller中添加一个方法，该方法将在单击cancel按钮时作为fallows调用。

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

别忘了在你的控制器中有一个uibModalInstance的依赖项。

你也可以在同一个控制器中点击addUser按钮来做同样的事情。

请参考Plunker