15

angularjsの下のボタンに確認ダイアログボックスを適用するにはどうすればよいですか?

<button class="btn btn-sm btn-danger" ng-click="removeUser($index)">Delete</button>

ちょうどこのような。

<span><a class="button" onclick="return confirm('Are you sure to delete this record ?')" href="delete/{{ item.id }}">Delete</span>

アップデート

現在、私はこのようにやっています

    function removeUser(index) {
      var isConfirmed = confirm("Are you sure to delete this record ?");
      if(isConfirmed){
        vm.users.splice(index, 1);
      }else{
        return false;
      }
    };
4

4 に答える 4

23

ここにスニペットがあります、

あなたのHTMLがどうあるべきか、

<button class="btn btn-sm btn-danger" ng-confirm-click="Are you sure to delete this record ?" confirmed-click="removeUser($index)">Delete</button>

このディレクティブをカスタム angularjs ファイルに含めてください。

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)
                    }
                });
            }
        };
}])

上記の削除機能に基づく角度範囲、

$scope.removeUser = function(index) {
    vm.users.splice(index, 1);
}
于 2016-02-19T09:27:59.650 に答える
10
$scope.removeUser= function (ind){
 if (confirm("Are you sure?")) {
    alert("deleted"+ s);
    $window.location.href = 'delete/'+ s;
 }
}

http://jsfiddle.net/ms403Ly8/61/

于 2016-02-19T09:12:05.447 に答える
3

メッセージ ビットを削除アクション ビットから分離して、アプリの他の部分で確認ビットを再利用できるようにします。次のようなディレクティブを使用します。

angular.module('myModule').directive("ngConfirmClick", [
  function() {
   return {
     priority: -1,
      restrict: "A",
      link: function(scope, element, attrs) {
        element.bind("click", function(e) {
          var message;
          message = attrs.ngConfirmClick;
          if (message && !confirm(message)) {
           e.stopImmediatePropagation();
           e.preventDefault();
          }
        });
      }
    };
  }
]);

次に、削除アクションを使用してコントローラーを機能させます。

$scope.removeUser(index) {
  //do stuff
}

ビューでは、ng-click を使用します。

<span><a class="button" ng-confirm-click="Are you sure?" ng-click="removeUser(item.id}}">Delete</span>

それが役に立てば幸い。

于 2016-02-19T09:12:09.397 に答える