Question

<div>
   <div class="pull-right">
      <button type="button" data-ng-click="editFigure()" id="Edit">Edit
      </button>
      <button type="button" data-ng-click="figurePreview()" id="Preview">Preview
      </button>
   </div>
   <div class="pull-right">
      <button type="button" data-ng-click="editTable()" id="Edit1">Edit
      </button>
      <button type="button" data-ng-click="tablePreview()" id=Preview">Preview
      </button>
   </div>
</div>

我想使用div显示表ng-show，同时应禁用数字div。可以帮我这个????

Answer 1

<body ng-app="myapp">
    <div ng-controller="mycontroller">
        <div class="pull-right">
            <button type="button" data-ng-click="editFigure()" id="Edit">Edit
            </button>
            <button type="button" data-ng-click="figurePreview()" id="Preview">Preview
            </button>
        </div>
        <div class="pull-right">
            <button type="button" data-ng-click="editTable()" id="Edit1">Edit
            </button>
            <button type="button" data-ng-click="tablePreview()" id="Preview">Preview
            </button>
        </div>
    </div>
    <div id="figure" ng-show="showFigure">I am a Figure</div>
    <div id="table" ng-show="showTable">I am a Table</div>
</body>

在控制器上：

angular.module('myapp', [])
  .controller('mycontroller', function($scope){
    // default show Figure, you can change it
    $scope.showFigure = true;
    $scope.showTable= false;

    $scope.editFigure = function(){ 
        $scope.showFigure = true;
        $scope.showTable= false;
    };
    $scope.figurePreview= function(){ 
        $scope.showFigure = true;
        $scope.showTable= false;
    };
    $scope.editTable= function(){ 
        $scope.showFigure = false;
        $scope.showTable= true;
    };
    $scope.editTable = function(){ 
        $scope.showFigure = false;
        $scope.showTable= true;
    };
});

试试这个。应该工作，当你更好地理解这个概念时，他们会改进代码。

编辑以提供完整的代码示例。

Answer 2

试试这个：

在html中，

<div ng-show="ShowDiv">
   This div shows if ShowDiv is true and hides if ShowDiv is false
</div>
<div ng-hide="ShowDiv">
   This div hides if ShowDiv is true and shows if ShowDiv is false
</div>

在控制器中，

$scope.ShowDiv = false;

$scope.someFunc = function(){
   $scope.ShowDiv = true;
}

如何隐藏基于ng-show nng-hide的按钮？

2 个答案: