javascript - AngularJS 的可见性

Question

我是 Angular 新手，有这个简单的问题。我有一个按钮，当我单击时我想显示一个网格和一些不可见的过滤器。过滤器是这样的。

<div ng-show="filtroFilial" style="visibility: hidden" class="col-md-2">
   <div class="form-group">
      <label>Estado da Filial</label>
      <div class="form-group form-md-line-input  no-hint right" style="padding-top: 3px;">
         <select id="regional" name="regional" chosen width="150" allow-single-deselect="true" ng-model="vm.relatorio.regional" style="width:100%"
            ng-options="regional.Cod_Regional as regional.Nom_Regional for regional in vm.regionais | orderBy:'Nom_Regional'" ></select>
      </div>
   </div>
</div>

网格是这样的。(开始)

<div id="divSilt" style="overflow-x: hidden;">
<div class="row">
<div class="col-md-12">
<div class="portlet light form-fit bordered" style="padding: 10px 20px 0 20px;">
<div class="portlet-body form">
<div class="tabbable tabbable-tabdrop">
<ul class="nav nav-tabs">

这是我的屏幕。

当我单击“Aplicar Filtros”时，我想显示隐藏的所有内容。我用ng-show 还是只是 ID ？这是我的 .js，

vm.filtrar = function() {
    $scope.$parent.vm.loading = $http({
        method: 'Post',
        url: _obterUrlAPI() + "AcompanhamentoSilt/FiltroSilt",
        dataType: "jsonp"
    }).then(function successCallback(response) {
        vm.importacaoSilt = response.data;
    }, function errorCallback(response) {
        MessageBox("Erro", response.data.Message);
    });
};

如果返回成功，我想显示所有像这样的内容。如何更改可见性？在我上面放置的js中吗？

Answer 1

您需要做的就是添加 ng-show="false"。

然后您需要做的就是向按钮添加一个 ng-click 来更改显示/隐藏 div 的变量。换句话说，你应该有这样的东西:

<div ng-show="showMe">
    this is hidden on load
</div>

在你的 Controller 中:

$scope.showMe = false;

这意味着您的 div 在页面加载时隐藏。现在您调用一个函数来显示 div

<button ng-click="showAll()"></button>

在你的 Controller 中

$scope.showAll = function(){
    $scope.showMe = true;
}

这将更改显示/隐藏 div 的变量。