AngularJS $ scope在函数中未定义

时间:2016-11-22 23:34:51

标签: javascript angularjs

另一个AngularJS noob需要别人的一点见解。

我有一个控制器(staffRenewalsController),它基本上定义了当用户点击表格行来编辑由$ scope.editRow处理的内容时要做什么。

它应该使用$ uibModal呈现一个模态对话框,它可以找到并显示两个按钮(保存和取消)。

问题: Save()有$ scope可用,而Cancel()有$ scope undefined。在过去的几天里我尝试了很多东西,我不确定为什么Cancel()的$ scope未定义。我将Save()重命名为任意内容,并且仍然可以使用$ scope。

有人可以查看下面我的缩写代码并详细说明我做错了吗?

        app.controller('staffRenewalsController', ['$scope', '$http', 'uiGridConstants', '$uibModal' , 
            function($scope, $http, uiGridConstants, $uibModal) {

            $scope.editRow = function(grid, row) {
                if(row.entity){
                    debugger
                    $scope.selectedRow = row.entity;
                    $scope.selectedRowBackup = $scope.selectedRow;
                    var renewalNumber = '';
                    renewalNumber += row.entity.RenewalNo;
                    var modalInstance = $uibModal.open({
                        animation: true,
                        templateUrl: '@Url.Action("View")' + '?renewalNumber=' + renewalNumber,
                        controller: myCommuteStaffRenewalSingleModalController,
                        size: 'lg',
                        scope: $scope,
                        resolve: {
                            items: function () {
                                debugger
                                return $scope.items;

                            }                                ,

                        }
                    });
                }
            }


        var myCommuteStaffRenewalSingleModalController = function($scope, uiGridConstants, $uibModal, $http, $uibModalInstance, items) {

        debugger
            $scope.selectedRecord = $scope.$parent.selectedRow;


            debugger
            $scope.save = function () {
                debugger;

                // $scope is present

            };



            $scope.cancel = function () {
                debugger;

                // $scope is undefined...why?

                $uibModalInstance.dismiss('cancel');
            };

        };              

1 个答案:

答案 0 :(得分:0)

Angular Bootstrap Documentation就是你要做的事情的一个很好的例子。

var modalInstance = $uibModal.open({
  animation: $ctrl.animationsEnabled,
  ariaLabelledBy: 'modal-title',
  ariaDescribedBy: 'modal-body',
  templateUrl: 'myModalContent.html',
  controller: 'ModalInstanceCtrl',
  controllerAs: '$ctrl',
  size: size,
  appendTo: parentElem,
  resolve: {
    items: function () {
      return $ctrl.items;
    }
  }
});

请注意,控制器值位于引号 controller: 'ModalInstanceCtrl'中。 我试试看。