Javascript 如何基于ng show n ng hide隐藏按钮？编辑预览编辑_Javascript_Angularjs

Javascript 如何基于ng show n ng hide隐藏按钮？编辑预览编辑

javascript angularjs

Javascript 如何基于ng show n ng hide隐藏按钮？编辑预览编辑,javascript,angularjs,Javascript,Angularjs,试试这个。当你更好地理解这个概念时，他们会改进代码编辑以提供完整的代码示例。尝试以下操作：在html中 angular.module('myapp', []) .controller('mycontroller', function($scope){ // default show Figure, you can change it $scope.showFigure = true; $scope.showTable= false; $scope.edi

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

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

尝试以下操作：

在html中

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;
    };
});

<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;
    };
});

<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;
}