Question

表中的

我可以在下面提到的代码中得到关键值数组。它工作正常

get value

<tbody ng-repeat="value in ITR">
        <tr ng-repeat="(key, val) in value">
            <td>{{val.pan_number}}</td>
            <td>{{val.name}}</td>
            <td>{{val.tax_payable}}</td>
            <td>{{val.taxes_paid}}</td>
            <td>{{val.year}}</td>
            <td><button class="btn btn-primary" ng-click="open($index)">Edit</button></td>
        </tr>
    </tbody>

在编辑时我想在提示代码下面的弹出文本框中显示所有值的 Controller.js

$scope.open = function(){
        var modalInstance = $uibModal.open({
            templateUrl: 'path.html',
             animation: true,
            controller: function($scope, $modalInstance) {
                $scope.cancel = function() {
                    $modalInstance.dismiss('cancel');
                };
                $scope.ok = function () {
                  $modalInstance.close();
                };
            }
        });
      }

popup.html

<div class="modal-content">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" ng-click="cancel()" aria-hidden="true">×</button>
    <h4 class="modal-title">ITR Update</h4>
  </div>
  <div class="modal-body">
    <input type="text" name="pan" ng-model="val.pan_number"/>
    <input type="text" name="pan" ng-model="value.pan_number"/>
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-default" ng-click="cancel()">No</button>
    <button type="button" class="btn btn-primary" ng-click="ok()">Yes</button>
  </div>
</div>

但我无法弄清楚我在这里犯了什么错误。如何解决这个问题？

Answer 1

您可以从模板中传递val，在模态控制器中传递resolve，如下所示，

<td><button class="btn btn-primary" ng-click="open(val)">Edit</button></td>

$scope.open = function(val){
    var modalInstance = $uibModal.open({
        templateUrl: 'popup.html',
        animation: true,
        resolve: {
          value: function(){ return val; }
        },
        controller: function($scope, $modalInstance, value) {
            //to retain original value, we are making copy
            $scope.val = angular.copy(value);
            $scope.cancel = function() {
                $modalInstance.dismiss('cancel');
            };
            $scope.ok = function () {
              for(var k in $scope.val){
                 value[k] = $scope.val[k];
              }
              $modalInstance.close();
            };
        }
    });
  };

<!--popup.html-->

<div class="modal-content">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" ng-click="cancel()" aria-hidden="true">×</button>
    <h4 class="modal-title">ITR Update</h4>
  </div>
  <div class="modal-body">
    <input type="text" name="pan" ng-model="val.pan_number"/>
    <input type="text" name="pan" ng-model="val.name"/>
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-default" ng-click="cancel()">No</button>
    <button type="button" class="btn btn-primary" ng-click="ok()">Yes</button>
  </div>
</div>

我们将对象引用（val）直接传递给模态。 ie）open(val)
使用resolve我们可以将val作为依赖项传递给模态控制器
由于我们将值绑定到ng-model - 实际更新原始value引用，如果我们直接使用它而不复制。因此，我们正在复制传递的value并将其绑定到ng-model。
当用户点击ok时 - 我们将修改后的值更新为原始value参考。

Answer 2

您需要使用scope: $scope

将范围传递给模型控制器

$scope.open = function(){
        var modalInstance = $uibModal.open({
            templateUrl: 'path.html',
            scope: $scope, //passed current scope to the modal
            animation: true,
            controller: function($scope, $modalInstance) {
                $scope.cancel = function() {
                    $modalInstance.dismiss('cancel');
                };
                $scope.ok = function () {
                  $modalInstance.close();
                };
            }
        });
      }

已编辑

或者您可以创建服务并从resolve调用该服务。这样您就可以从控制器访问数据。为此，您需要在打开模型之前先将数据保存在服务中

var modalInstance = $uibModal.open({
    templateUrl: 'path.html',
    scope: $scope, //passed current scope to the modal
    animation: true,
    resolve {
        getData: function(sampleService) {
            return sampleService.getData(); // return the nessasry data for your model
        }
    }
    controller: function($scope, $modalInstance, getData) {
        $scope.val = getData; // return the data
        $scope.cancel = function() {
            $modalInstance.dismiss('cancel');
        };
        $scope.ok = function() {
            $modalInstance.close();
        };
    }
});

Answer 3

你错过了函数中的参数：

$scope.open = function(index){
        var modalInstance = $uibModal.open({
            templateUrl: 'path.html',
            animation: true,
            resolve:{
                IndexValue:function(){return index;}
            }
            controller: function($scope, $modalInstance, IndexValue) {
                $scope.cancel = function() {
                    $modalInstance.dismiss('cancel');
                };
                $scope.ok = function () {
                  $modalInstance.close();
                };
                $scope.value = {
                    pan_number:IndexValue()
                }
                $scope.val = {
                    pan_number:IndexValue()
                }
          }
        });
      }

Angularjs在弹出文本框中获取索引值

3 个答案: