Question

我这个简单易用的代码。

html代码段：

<div class="iconbar" ng-controller="icons">
    <span ng-click="iconclk()">icon</span>
    <div ng-if="icon1">value</div>
</div>

和js：

app.controller('icons', function($scope)
{
    $scope.icon1 = false;
    $scope.iconclk = function(){
                         if(!$scope.icon1) $scope.icon1 = true;
                         else $scope.icon1 = false;
                     };
});

现在问题是我不会将icon1作为iconclk中的参数传递给多个图标使用相同的功能（icon1，icon2，icon3 ......）我试过这个：

HTML：

<div class="iconbar" ng-controller="icons">
    <span ng-click="iconclk(icon1)">icon</span>
    <div ng-if="icon1">value</div>
</div>

和js：

app.controller('icons', function($scope)
{
    $scope.icon1 = false;
    $scope.iconclk = function(icon){ 
                         if(!icon) icon = true;
                         else icon = false;
                     };
});

但是没有用。请帮忙吗？提前谢谢！

Answer 1

主要问题是您正在按值传递，因此修改icon不会更改icon1。相反，我会将您的图标变量更改为数组并通过索引引用：

<div class="iconbar" ng-controller="icons">
    <span ng-click="iconclk(1)">icon</span>
<div ng-if="icon[1]">value</div>
</div>

其他人将是iconclk(2)＆amp; icon[2]，iconclk(3)＆amp; icon[3]，等等......

控制器：

app.controller('icons', function($scope) {
  $scope.icon = [false, false, false]; // or just [] if you want it to be simple
  $scope.iconclk = function(icon) {
    $scope.icon[icon] = !$scope.icon[icon];
  };
});

在angularjs中重用函数

1 个答案: