在 AngularJS 中实现 Ekathuwa 模块,将 ng-repeat 值传输到模态


我目前陷入了在

angularjs上实现模态的困境。我对这个框架仍然很陌生,我正在使用我从 ng-modules.org 获得的模块之一,https://github.com/sarath2/ngEkathuwa ngEkathuwa,它实现了引导 3 模式。但是,我很难理解如何使用模块将 ng-repeat 列表的值传输到模态。

            <table ng-table="tableParams" class="table">
                <tr ng-repeat="uti in $data">
                    <td data-title="'UTI Meter'" sortable="meter">
                        {{uti.item}}
                    </td>                   
                    <td data-title="'Date'" sortable="cdate" align="middle">
                        {{uti.cdate}}
                    </td>
                    <td align="middle" data-title="'Action'">
                        <button type="button" class="btn btn-default" data-toggle="modal" data-target="#myDelete" ng-click="deleteUti(uti.ikey)">
                            <span class="glyphicon glyphicon-remove-sign"></span> Delete
                        </button>
                        <button type="button" class="btn btn-default" data-toggle="modal" data-target="#myEdit">
                            <span class="glyphicon glyphicon-edit"></span> Edit
                        </button>
                    </td>
                </tr>
            </table>

http://plnkr.co/ebDtSMw6w0IZquaglEMe,来自github的示例仅显示了从按钮触发的静态数据。我已经梳理了网站,有人说您必须使用解析来传输数据,然后显示在您的模态上。再一次,我无法在文档中找到它。我只是想知道该模块是否仅支持静态数据,或者应该在模态控制器下完成解析。

无论如何,以下是脚本,任何帮助克服这个绊脚石肯定会不胜感激。

这是控制器:实现了解析{}。

myApp.controller('utiCtrl', 
    function gaugeCtrl($scope, $filter, ngTableParams, $log, $http, $ekathuwa){
    $scope.addUTI = function(){
        $ekathuwa.modal({
            id: "modalUTI",
            scope: $scope,
            templateURL: "./tpl/modal-uti.html"
        });
    }
    $scope.deleteUti = function(ikey){
        var p = $ekathuwa.modal({
            id: "modalUtiDelete",
            scope: $scope,
            contentPreSize: "sm",
            controller: modalDeleteCtrl,
            templateURL: "./tpl/modal-delete.html",
            show: true,
            resolve: {
                meter: function(){
                    return 'Test';
                }
            }
        });
        $q.when(p).then(function (m) {
            m.modal('show');
        });
    }
    var modalDeleteCtrl = function ($scope, $p, meter) {
      $scope.meter = meter;
    };
});

我能够找出问题的答案。谢谢布兰登·蒂利的例子,它让我对这个问题有了进一步的理解。

我需要按范围在模态内声明传递的值 ikey。与使用 ui.bootstrap 的模态不同,此模块也使用双向绑定,并且不使用 resolve{} 将数据显示到模态接口。

    $scope.deleteUti = function(ikey){
        $scope.meter = ikey;
        $ekathuwa.modal({
            id: "modalUtiDelete",
            scope: $scope,
            contentPreSize: "sm",
            controller: modalDeleteCtrl,
            templateURL: "./tpl/modal-delete.html"
        });
        var modalDeleteCtrl = function ($scope) {
        };
    }

最新更新