Question

我的模态窗口有简单的角度控制器

var ModalDialogCtrl = function ($scope) {
    $scope.data;
};

我从d3获得了动态生成的数据（我不能对此内容使用ng-click）。我在d3 onclick中设置了这样的事件：

    .on("click", function(d, i) {
        //get some data           
        angular.element($('#modalDialog')).scope().data = data;
        $('#modalDialog').modal('show');
    })

对话框显示没有任何数据，但是当我关闭它时，数据会显示在其中（关闭带有模态数据的动画！）。如何显示对话框中的数据？！

dialog first opening

dialog second opening and first hiding

我的对话代码：

<div class="wrapper">
    <span>
        <span class="modal-table-header"  data-dismiss="modal" ng-click='cancel()'>close</span>
        <a class="close" data-dismiss="modal"  ng-click='cancel()'><span class="icon-remove-circle icon-bold"></span></a>
    </span>
    </br> </br>
    <table style="display: list-item;">
        <thead>
        <tr>
            <th>{{data[0].headerName}}</th>
            <th ng-repeat="subData in data[0].subData">{{subData.category}}</th>
        </tr>
        </thead>
        <tbody>
        <tr ng-repeat="item in data">
            <td>{{item.header}}</td>
            <td ng-repeat="subData in item.subData">{{subData.value}}</td>
        </tr>
        </tbody>
    </table>
</div>

Answer 1

您需要$apply让Angular知道数据已更改：

    angular.element($('#modalDialog')).scope().data = data;
    angular.element($('#modalDialog')).scope().$apply();
    $('#modalDialog').modal('show');

首次在设置data后立即打开对话框时，没有执行$digest循环，而角度不知道scope.data已更新。在显示模态对话框之前，明确调用$apply将让角度知道更改。

然而，在第二次打开模态之前，我怀疑已经执行了$digest循环作为其他一些操作的副作用，因此，您可以看到数据。

引导模态与角度的麻烦

1 个答案: