如何在angular.js中显示单击的div的前一个div

Question

我有一个这样的 html

  <div  class="main" ng-controller="firstcontroller">
       <div class="submain">
           <div class="first" ng-show="display">displayed</div>
           <div class="second" my-directive>click</div>
       </div>
       <div class="submain">
           <div class="first" ng-show="display">displayed</div>
           <div class="second" my-directive>click</div>
       </div>
       <div class="submain">
           <div class="first" ng-show="display">displayed</div>
           <div class="second" my-directive>click</div>
       </div>
 </div>

我有这样的控制器

     app.controller('firstcontroller',function($scope)
     {
         $scope.display=false;

     });

我的指令编码是这样的

 app.directive('myDirective',function(scope, element, attrs)
 {
    return function()
    {
        element.bind('click',function()
       {
             element.prev().show();
            //alert(element.prev().attr('class'));

        //   element.parent().find('.main').append('<div>Some text</div>')
       });


    }

 });

如果 div 的 class name 为 first ，这里最初 div 将被隐藏，只有 class name second 的 div 会被显示。因此，当我们单击单击 div 时，我们必须仅显示该单击 div 的前一个 div .....如何在 angular.js 中显示单击 div 的前一个 div？

Answer 1

我觉得这个问题缺少信息。例如。 .submain div 是硬编码的，还是通过迭代创建的？

如果确实如此，则该指令是多余的。将 HTML 更改为：

<div  class="main" ng-controller="firstcontroller">
   <div class="submain">
       <div class="first" ng-show="display[0]">displayed</div>
       <div class="second" ng-click="display[0] = !display[0]">click</div>
   </div>
   <div class="submain">
       <div class="first" ng-show="display[1]">displayed</div>
       <div class="second" ng-click="display[1] = !display[1]">click</div>
   </div>
   <div class="submain">
       <div class="first" ng-show="display[2]">displayed</div>
       <div class="second" ng-click="display[2] = !display[2]">click</div>
   </div>
</div>

还有控制器：

 app.controller('firstcontroller',function($scope) {
     $scope.display=[false, false, false];
 });