Question

我需要在图像上添加一个ng-click功能，当我点击它时必须增加尺寸，然后当我把鼠标放回原来的尺寸时。

使用css我创建了这个并在将鼠标放在图像上时运行良好

d3

在html上我有

 .images img{
  float: left;
  height: 100px;
  width: 100px;
}

.images img:hover{
width: 30%;
height: 30%%;
transition: width 2s, height 4s
}

我不知道我必须在changeSize上写什么才能在点击它时改变图像的大小。

我想使用ng-click事件，如何调用函数changeSize的css值？

感谢。

Answer 1

该功能需要在您的控制器中。

function toggleSize() {
  angular.element(document).find('#img-responsive').css({ 'width': '30%', 'height': '30%' });
}

<img id="img-responsive" ng-click="$scope.toggleSize()" ng-src="https://www.google.it/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png"  />

Answer 2

 <img ng-click="$ctrl.toggleSize()" ng-class="{little: $ctrl.littleSize, big: !$ctrl.littleSize}" ng-src="https://www.google.it/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png"  />

在你的控制器中：

$ctrl.littleSize = true;

$ctrl.toggleSize = function() {
    $ctrl.littleSize = !$ctrl.littleSize;
}

如何通过点击角度js来增加图像大小？

2 个答案: