angularjs 在ng-repeat上显示所有隐藏的文本字段，而不是Angular中的一个

pxiryf3j 于 12个月前发布在 Angular

关注(0)|答案(1)|浏览(95)

我开始使用Angular，它很好地实现。我在ng-click上遇到了一个问题。
我正在动态获取数据，并显示与ng-repeat，我想更新的数据在铅笔点击，我使用输入文本元素，但当我点击铅笔，它打开所有的文本字段。
下面是我的HTML代码：

<

div ng-repeat="item in scroller.items track by $index">
       <div class="secHead text-center">
         <button class="common btnDarkGrey" data-ng-hide="hideCatButton">{{item.category_name}}</button>
         <input type="text" id="focus-{{$index}}" class="common btnDarkGrey editDashboardCategory" name="editCategory" value="" data-ng-model="item.category_name" data-ng-show="hideField">
     <span  data-ng-click="updateCategory(item.category_id,item.category_name,$index)"   class="chkOneDone" data-ng-show="hideOkButton">Done</span>
       <div class="pull-right">
           <a href="#" class="pen" data-ng-click="updatePen($index)"></a>
     </div>
    </div>
     </div>

字符串
下面是我的Angular代码：

$scope.updateCategory=function(category_id,updated_cat_name, $index){
        Category.updateCat($rootScope,$scope,$index,$http,$timeout,updated_cat_name,old_cat_name,category_id);
    };
$scope.updatePen=function($index){
        old_cat_name=$scope.scroller.items[$index].category_name
        $scope.hideField=true;
        $rootScope.hideOkButton=true;
        $rootScope.hideCatButton=true;
        
};

型
我创建了一个分类服务来执行类似“更新”的任务。
我可以尝试解决这个问题吗？

angularjs

来源：https://stackoverflow.com/questions/27855493/ng-click-showing-all-the-hidden-text-field-on-ng-repeat-rather-than-one-in-angul

1条答案

按热度按时间

kqlmhetl1#

如果你只想隐藏/显示列表中的一个元素，你需要以某种方式指定它。现在你有三个rootScope布尔值：$scope.hideField=true; $rootScope.hideOkButton=true; $rootScope.hideCatButton=true;被设置为整个列表，你需要设置一个显示属性的每个人在列表中。
在你的控制器函数中，你可以在你期待点击之前做一些类似的事情：

//normal for loop so that you have the index
for(var i=0; i < $scope.scroller.items.length; i++){
  $scope.scroller.items[i].show = false;
}

字符串
然后，您可以执行类似于以下操作的操作来实际显示字段：

HTML:
  div ng-repeat="item in scroller.items track by $index">
   <div class="secHead text-center">
     <button class="common btnDarkGrey" ng-hide="!item.show">
       {{item.category_name}}</button>
     <input type="text" id="focus-{{$index}}" class="common btnDarkGrey editDashboardCategory" name="editCategory" value="" ng-model="item.category_name" ng-hide="!item.show">
 <span  data-ng-click="updateCategory(item.category_id,item.category_name,$index)"   class="chkOneDone" ng-show="item.show">Done</span>
   <div class="pull-right">
       <a href="#" class="pen" data-ng-click="updatePen($index)"></a>
 </div>
</div>
 </div> 

Controller:
  //controller declaration --
    $scope.updatePen = function(index){
      $scope.scroller.items[index].show = true;
    };

型
我的理解是，一旦发生单击，您需要显示所有三个属性，因此我将所有show属性压缩为一个show属性。
您的视图只看到hideField为true，并对数组中的所有项执行该操作。我希望这有帮助！

赞(0）回复(0）举报 12个月前

我来回答

angularjs 在ng-repeat上显示所有隐藏的文本字段，而不是Angular中的一个

1条答案

相关问题

热门标签

最新问答