AngularJS1.5に再挑戦 その13 Confirm Comment Delete

概要

AngularJS1.5に再挑戦 その13 Confirm Comment Delete

参考動画・参考サイト

Coding for Entrepreneurs

AngularJS — Superheroic JavaScript MVW Framework

Confirm Comment Delete

• delete機能をつける。まずは簡単なものをblog-detail.components.jsにつける。

            $scope.deleteComment = function(){
                $scope.post.comments.splice(comment, 1)
                // someResource.$delete() で、jsonから削除できる
            }

• blog-detail.htmlを編集する。

<li ng-repeat='comment in post.comments | filter: query'>
        {{ comment.text }} <a href='#' ng-click='deleteComment(comment)'>Delete</a>
    </li>

• 上記で削除はできるが、上から順番に削除されてしまう。これは後で変更しないとなぁ。

• blog-detail.htmlを修正する。

<ul>
    <li>
        <input type='text' ng-model='query' placeholder='filter comments' />
    </li>
    <li ng-repeat='comment in post.comments | filter: query'>
        {{ comment.text }} <a href='#' confirm-click='削除してもよろしいですか？' confirmed-click='deleteComment(comment)'>Confirm</a> <a href='#' ng-click='deleteComment(comment)'>Delete</a>
    </li>
</ul>

• blog-detail.components.jsonに追記する。

            $scope.deleteComment = function(comment){
                $scope.$apply(
                $scope.post.comments.splice(comment, 1)
                )
                // someResource.$delete() で、jsonから削除できる
            }