Question

使用angular.js有一种方法可以使用单个模型变量设置页面中所有元素与特定类的可见性吗？

等角度

$(".myClass").hide();

感谢，卢卡

Answer 1

在html代码中，您可以使用指令

<div ng-show="shouldShow"></div>

并在控制器中

$scope.shouldShow =  (true or flase)

Answer 2

尝试 ngClass

看看这个。

这取决于$scope.data的布尔值，内容将被显示或隐藏。即如果$scope.data = true内容将被隐藏，以及是否会显示虚假内容

<强> Working Demo

<强> HTML

<div ng-app='myApp' ng-controller="ArrayController">
    <div ng-class="{show: data, hide:data}">Content</div>
</div>

<强>脚本

var app = angular.module('myApp', []);
app.controller('ArrayController', function ($scope) {
   $scope.data = true;// for Hiding
});

<强> CSS

.hide{
    display:none;
}

Answer 3

我想说要添加这样的指令。

directive('className', function () {
    return {
      restrict: 'C',
      link: function (scope, elem, attrs) {
        elem.hide();
      }
    }
});

在MarkUp中

<div class="className">Content</div>

这是为您制作的 Plunker 。

Answer 4

我认为这对你有用。看看这个jsfiddle

HTML

<div ng-app=''>
    <div ng-class="selectCss">Content</div>
    <input type="button" ng-model="selectCss" value="show" ng-click="selectCss='show'"> 
    <input type="button" ng-model="selectCss" value="hide" ng-click="selectCss='hide'"/>
</div>

的CSS

.hide{
    display:none;
}

如何使用angular.js设置对类的可见性

4 个答案: