嵌套的ng-repeat索引不工作||嵌套的ng-click不起作用

时间:2016-03-30 11:39:32

标签: javascript jquery html angularjs

如果我们创建两个或三个评论并对其进行多次回复,则“有用”链接在单击时会导致问题,因为它对具有相同编号的索引执行ng-click操作,从而显示具有相同索引的所有文本。如何解决此嵌套,以便在单击链接时仅显示相应的文本

http://plnkr.co/edit/XS4Nro3sdIWMnopdgDYG?p=preview

ng-click和ng-show操作正在通过myDiscuss控制器工作

...
MaskedTextBox maskedtextbox;
myUserControl()
{
    ...
    maskedtextbox = new MaskedTextBox(){
        some stuff...
    };
}

[DefaultValue("")]
[Editor("System.Windows.Forms.Design.MaskPropertyEditor, System.Design, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a", typeof(UITypeEditor))]
[Localizable(true)]
[MergableProperty(false)]
[RefreshProperties(RefreshProperties.Repaint)]
public string InputMask
{
    get { return this.maskedtextbox.Mask; }
    set { this.maskedtextbox.Mask = value; }
}

对于html文件,请查看plunker链接。

有用和回复链接位于reply-link.html文件

2 个答案:

答案 0 :(得分:2)

这是一个Plunker:http://plnkr.co/edit/PQ36lMXR1YOs8DP7WXMk?p=preview

我所做的是将helpful: 0添加到评论和回复对象中。还将<p ng-if="object.helpful">{{ object.helpful }} </p>添加到comment-section.html和reply-box.html

然后点击有用时添加了一个名为increaseHelpful(object)的新功能,您可以在每次点击时将有用变量增加一。当然你需要让一个用户只能点击一次,但仅举例来说:)

答案 1 :(得分:2)

同时获取index1,这样您就可以获得回复框,点击回复按钮。使用selectSubTab(index,index1),然后在$scope.subTab中有两个变量来检查选择的内容。

来自Konkko的plnkr http://plnkr.co/edit/lbn57aPTJQpgzMaQPW6t?p=preview

回复box.html

<div  id ="wrapper">
  <form ng-submit="replysubmit()" ng-controller="BlockController">
    <div class="clearfix" ng-if="isSelectedSub(index)">

      <input type="textarea" tabindex="0"
      style="overflow: auto; max-height: 350px; margin-top:1px;" class ="col-sm-8 col-md-8 col-lg-11" ng-model="reply.comment"
      name="reply.comment" placeholder="Write a Reply" />
    </div>
    <blockquote  ng-repeat="(index1,object) in replybox">
      <h4>Name</h4>
      <p>
        {{object.comment}} {{index1+1}}
      </p>
      <p ng-if="object.helpful">{{ object.helpful }} </p>
      <ul reply-links></ul>
      <div class="clearfix" ng-if="isSelectedSub(index, index1)">

        <input type="textarea" tabindex="0"
        style="overflow: auto; max-height: 350px; margin-top:1px;" class ="col-sm-8 col-md-8 col-lg-11" ng-model="reply.comment"
        name="reply.comment" placeholder="test" />
      </div>
    </blockquote>
  </form>
</div>

回复links.html:

<ul class="nav nav-pills">
    <li>
      <a href ng-click="increaseHelpful(object)" class="glyphicon ">Helpful</a>
    </li>
    <li>
      <a href ng-click="selectSubTab(index, index1)" class="glyphicon" >Reply</a>
    </li>
</ul>

JS:

$scope.subTab = {first: null, second: null};

$scope.selectSubTab = function(setTab, setTab1){
    console.log(setTab);console.log(setTab1);
    $scope.subTab = {first: setTab, second: setTab1};
  };

$scope.isSelectedSub = function(checkTab, checkTab1){
    return $scope.subTab.first === checkTab && $scope.subTab.second === checkTab1;
  };