javascript - ng-if 条件无法正常工作 [AngularJS]

Question

当我点击评论或回复链接时，所有卡片的表单都会打开。如何设置特定范围，以便仅在单击链接时打开表单。

下面的函数与 html 中的 ng-if 一起使用来隐藏表单。单击后，它应该只打开相应的表单。

 $scope.increaseReply = function(object) {
   object.replyone += 1;
 };

Here is plukr link

Answer 1

您应该为每个评论分配replyActive 位。为此，您可以使用迭代对象(我假设您正在使用 ng-repeat)。您可以以交互方式向对象添加另一属性并自由使用。

简单的例子；

var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {
 	$scope.commentList = [
    	{
      	"author": "Tugca Eker",
        "comment": "You should check this example..."
      },
      {
      	"author": "Gagan",
        "comment": "ng-if not working"
      },
      {
      	"author": "Tugca Eker",
        "comment": "Check it again"
      }
    ];
  	
}

ul li{
  padding: 5px;
  border: 1px solid black;
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-controller="MyCtrl">

  <ul>
    <li ng-repeat="comment in commentList" ng-init="comment.isReplyActive = false;">
      <b>{{comment.author}}</b>: {{comment.comment}}
      <br />
      <a ng-click="comment.isReplyActive = !comment.isReplyActive;">Reply Now!</a>
      <div ng-if="comment.isReplyActive">
        <input type="text">
      </div>
    </li>
  </ul>
 
</div>

Stackoverflow 上的片段失败，我不知道为什么。检查这个 fiddle ，http://jsfiddle.net/Lvc0u55v/7762/