Question

您能否解释为什么ng-confirm-click不起作用？

<div ng-controller="MainCtrl" ng-init="show=true;">
  <p >Hello {{name}}!</p>
  <button ng-show="show" confirmed-click="changes();show=false;" ng-confirm-click="Confirm change?">change</button>
</div>

我需要隐藏按钮。

这里的例子是：

<!DOCTYPE html>
<html>

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script>
    <script src="app.js"></script>
  </head>

  <body ng-app = "plunker">
    <div ng-controller="MainCtrl" ng-init="show=true;">
      <p >Hello {{name}}!</p>
      <button ng-show="show" confirmed-click="changes();show=false;" ng-confirm-click="Confirm change?">change</button>
    </div>
  </body>

</html>

Answer 1

试试这个有效的代码，

内部html：

  <div ng-confirm-click="Are you sure to delete this product ?" confirmed-click="deletePost(data.postId)"> <span class="glyphicon glyphicon-trash"></span></div>

在app.js文件中，输入以下代码（不做任何更改）：

app.directive('ngConfirmClick', [
    function(){
        return {
            link: function (scope, element, attr) {
                var msg = attr.ngConfirmClick || "Are you sure?";
                var clickAction = attr.confirmedClick;
                element.bind('click',function (event) {
                    if ( window.confirm(msg) ) {
                        scope.$eval(clickAction)
                    }
                });
            }
        };
}])

Answer 2

使用scope.$apply代替scope.$eval，并从控制器中删除不必要的scope.$apply。

来自文档：

$ eval：scope。$ eval（）的使用似乎不赞成使用范围。$ apply用于执行使用和修改范围的函数，并稍后更新视图。

Plunker

Angular ng-confirm-click不起作用

2 个答案: