javascript - 在 ng-repeat 中的 ng-click 上显示隐藏的 div

Question

$scope.editPostComment = false;

当我单击btn时，它会在所有重复项目中显示textarea，而我只想在单击的div上显示它!

 <div class="commentBox" ng-show = "editPostComment" >
                    <textarea name="editor2" class="content-box allfilecomment" id="comment-box" focus-me="{{focusCommentBox}}"
                    ng-model="allCommentText"
                    markdown-editor="{'iconlibrary': 'fa', addExtraButtons: true, resize: 'vertical'}"
                    rows="10" >

                    </textarea>
                    <div class="hints">
                      <span class="boldtext">**Bold**</span>
                      <span class="italictext">_itlaics_</span>
                      <span class="striktext">~~strike~~</span>
                      <span class="codetext">'code'</span>
                      <span class="codetext">'''preformatted'''</span>
                      <span class="quotetext">>quote</span>
                    </div>
                    <div id="comment-btns">
                      <button class="btn btn-primary pull-left" ng-class="{'loading': commentig}" ng-disabled="commentig" ng-click="postAllComment(commentmode)">Edit</button>
                    </div>
                </div>

Answer 1

您需要使用索引为每一行指定一个 ID，然后根据该 ID 使该行可见。

function showEdit(id) {
    vm.editPostComment = id;

}

 
 
 <div ng-repeat="row in rows track by $index">
     <div class="commentBox" ng-show = "editPostComment == $index" >
         <textarea name="editor2" class="content-box allfilecomment" id="comment-box" focus-me="{{focusCommentBox}}"
                    ng-model="allCommentText"
                    markdown-editor="{'iconlibrary': 'fa', addExtraButtons: true, resize: 'vertical'}"
                    rows="10" >

                    </textarea>
                    <div class="hints">
                      <span class="boldtext">**Bold**</span>
                      <span class="italictext">_itlaics_</span>
                      <span class="striktext">~~strike~~</span>
                      <span class="codetext">'code'</span>
                      <span class="codetext">'''preformatted'''</span>
                      <span class="quotetext">>quote</span>
                    </div>
                    <div id="comment-btns">
                      <button class="btn btn-primary pull-left" ng-class="{'loading': commentig}" ng-disabled="commentig" ng-click="showEdit($index)">Edit</button>
                    </div>
                </div>
</div>