输入数据后退出模态

Question

从表单提交数据并单击提交按钮后，我希望关闭模式。我应该在$ dtate.go中放置什么，这样才能实现我想要的结果？

模态控制器

 .controller('DietController', ['$scope', 'Diet', '$state', function($scope, Diet, $state) {
    $scope.diets = [];

    $scope.submitForm = function() {
      Diet
        .upsert({
          date: $scope.diet.date,
          food: $scope.diet.food
        })
        .$promise
        .then(function() {
          $state.go('diet');
        });
    };
  }]) 

modal html

<div class="modal fade" id="myModalNorm" tabindex="-1" role="dialog" 
 aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
    <div class="modal-content">

        <!-- Modal Body -->
        <div class="modal-body">

            <form role="form">
              <div class="form-group">
                <label>Date</label>
                  <input class="form-control" type="date" ng-model="diet.date">
              </div>
              <div class="form-group">
                <label>Food Description</label>
                  <textarea type="text" class="form-control" ng-model="diet.food" placeholder="Enter food"></textarea>
              </div>

        <!-- Modal Footer -->
        <div>
            <button type="button" class="btn btn-primary" ng-click="submitForm()">
                Submit
            </button>
        </div>
        </form>
    </div>
</div>

Answer 1

试试这个：

.then(function() {
     $('#myModalNorm').modal('hide');
});

Answer 2

如果您正在使用bootstrap modal，请加入$uibModalInstance并在其上调用close方法：

controller('DietController', ['$scope', 'Diet', '$state', '$uibModalInstance', function($scope, Diet, $state, $uibModalInstance) {
    $scope.diets = [];

    $scope.submitForm = function() {
      Diet
        .upsert({
          date: $scope.diet.date,
          food: $scope.diet.food
        })
        .$promise
        .then(function() {
          $uibModalInstance.close();
        });
    };
  }])