Question

当我按下按钮更改时，我想调整div的大小。我使用的是ng-style，这是我的HTML代码。

<div id="lokacija" ng-style="myStyle">
   <button class="change" ng-show="pokazi" ng-click="myStyle={'height':'{{visina}}'} ;function() ">Change </button> 
 </div>

控制器：

    angular.module('Bosk')
.controller('StartCtrl', function($scope){ 
    $scope.visina="99px"; 
      $scope.funkcija = function(){
            var element = angular.element(document.querySelector('#lokacija')); 
          var height = element[0].offsetHeight;  
          if(height<100){               
           $scope.visina="400px";
            console.log('if');
          }
          else{
               $scope.visina="99px";
              console.log('else'); 

          }
    } 
})

就像你看到我想要它当我第一次按下按钮调整大小到400像素，当我再次按它时我希望它返回到99像素。当我第一次按下它时，但是当我想要它返回它时，它并没有。我必须刷新ng-style或？

Answer 1

<!DOCTYPE html>
<html ng-app="app">
<head>
    <title></title>
    <script src="https://code.angularjs.org/1.4.8/angular.js"></script>
    <script type="text/javascript">
     var app = angular.module('app',[]);
     app.controller('myCtrl',function myCtrl($scope){
        $scope.height = '20px';
        $scope.changeHeight = function(){
            $scope.height = $scope.divHeight+'px';
        };
    })

</script>


</head>
<body ng-controller="myCtrl">

    <div>
        <input type="number" ng-model="divHeight" name="">
        <button ng-click="changeHeight()">change Height</button>
    </div>
    <div ng-style="{height:height}" style="background: red; margin-top: 12px">
        height = {{height}}
    </div>


</body>
</html>

不能用ng风格调整div

1 个答案: