Question

我正在尝试在我的HTML中打开一个DIV作为模态窗口。

我的HTML如下所示：

<div class='divHeading' id='configurations'>
    <div class='divDisplay' id='array'>
        <div class='divHeading'>
            <h4 class='plus' data-ng-click='hide($event)'>
                Configuration
                 <input type='submit' name='disable' value='Disable'
                    data-ng-click='disable($event)' class='add-regular  pull-right'>
                 <input type='submit' name='update' value='Update'
                    data-ng-click='update($event)' class='add-regular pull-right'>
            </h4>
        </div>
    </div>
</div>

点击更新，模态打开并将div复制到模态，此副本工作正常，控制器的js为：

var TestController = function($scope, $window, $http, $routeParams, $sce,
        $compile, $ocModal) {
    $scope.update = function(updateClicked) {
        var currentConfInnerHTML = updateClicked.target.parentNode.parentNode.innerHTML;
        var configurationsDiv = updateClicked.target.parentNode.parentNode.parentNode;
        $compile(currentConfInnerHTML)($scope);
        $ocModal.open({
            url : 'partials/TestConfigurationModal.html',
            controller : 'modalController',
            cls : 'fade-in',
            init : {
                currentConf : currentConfInnerHTML,
                confDiv : configurationsDiv
            }
        });

        $scope.disable = function(disableClicked) {
            alert("Disable Clicked");
            disableClicked.stopPropagation();
        };
}

模板代码为：

     <script type="text/ng-template" id="partials/TestConfigurationModal.html">
           <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="closeModal()">&times;</button>
            <h4 class="modal-title">Clone Configuration</h4>
           </div>
           <div id="copyConf" class="divHeading">
           </div>
           <input type='submit' name='update' value='Update' data-ng-click='addCloneToMainConfig($event)' id='btn'>

 </script>

模态控制器是：

var modalController = function($scope, $window, $http, $routeParams, $sce,
        $compile, $ocModal, $init) {
    html_code = $init.currentConf;
    document.getElementById('copyConf').innerHTML = html_code;
    $compile(document.getElementById('copyConf'))($scope);

    $scope.addCloneToMainConfig = function(u) {
        var new_row = document.getElementById('copyConf');
        var con = document.getElementById('configurations');
        con.childNodes[1].appendChild(new_row);
        $compile(document.getElementById('configurations'))($scope);
    };
}

div也成功附加到父html div，但新添加的子项的按钮不起作用。

我已经尝试过编译这两个div，但都失败了。

我非常困难，真的需要帮助。请引导一下。

克隆从父级到模态的div，然后使用angularjs将div上的div附加到父html中的div？

0 个答案: