Question

我正在使用magnific popup将模态窗口加载到我的html中，这基本上是这样做的：

<html ng-app='basket'>
    <body ng-controller='BasketController as basket'>

        <a id='open' href='/product/1'>Open modal</a>
        <a ng-click='addToCart(1)'>Add to cart</a>
    </body>
</html>

... Ajax加载后

<html ng-app='basket'>
    <body ng-controller='BasketController as basket'>

        <div class='modal>
            <h1>Product title</h1>
            <a ng-click='addToCart(1)'>Add to cart</a>
        </div>

        <a id='open' href='/product/1'>Open modal</a>
        <a ng-click='addToCart(1)'>Add to cart</a>
    </body>
</html>

但是模态中的ng-click并未触发。 有没有办法可以使用模态内容刷新范围？

首先，我想我可以通过在开放模式按钮上添加ng-click来实现它，该按钮可以将范围传递给打开模态的另一个函数。我有一个函数可以在加载后控制日志$scope，但我只需要刷新或者某些东西使角度识别模态窗口中的新html。

Answer 1

这不起作用的原因是因为angularJS不知道模态内的ng-click。 jQuery通过它的外观添加它。 AngularJS尚未处理HTMl，并且ng-click不执行任何操作。

但是，您可以使用AngularJS中的$ compile函数来编译具有特定范围的模式HTML。然后，ng-click将起作用。

在这里阅读有关$ compile的内容：

https://docs.angularjs.org/api/ng/service/ $编译

所以你的案例可能是：

$compile(modalElement)($scope);

在BasketController中发生这种情况，因此将传入BasketController来管理modalElement - 原始DOM元素，而不是jQuery元素。

所以在某些时候，如果你有权访问modal html（只是在加载后），你可以这样做。虽然不推荐！使用Angular库。

Angular JS ng-在模态窗口内单击/在模态回调中刷新角度范围

1 个答案: