2015-12-14 3 views
0

Как выбрать в AngularJS, какой элемент html для отображения? Я получаю значение какого-либо элемента из базы данных и, если да, я хочу, чтобы показать это: <i class="fa fa-check"></i> или если НЕТ это: <i class="fa fa-times"></i>Выбор того, какой элемент html отображать в AngularJS

+1

https: // документы. angularjs.org/api/ng/directive/ngClass –

ответ

0

<!DOCTYPE html> 
 
<html ng-app="app" ng-controller="ExampleController"> 
 

 
<head> 
 
    <title>stackoverflow</title> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
</head> 
 

 
<body> 
 

 
    <div ng-show="dataFromDataBase"> 
 
    view A 
 
    </div> 
 

 
    <div ng-hide="dataFromDataBase"> 
 
    view B 
 
    </div> 
 

 
    <button ng-click="change()">return false/true</button> 
 

 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-rc.0/angular.js"></script> 
 

 
    <script> 
 
    //https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-rc.0/angular.js 
 
    angular.module("app", []) 
 
     .controller("ExampleController", ["$scope", 
 
     function($scope) { 
 

 
      $scope.dataFromDataBase = true; // or false 
 

 
      $scope.change = function() { 
 
      $scope.dataFromDataBase ? $scope.dataFromDataBase = false : $scope.dataFromDataBase = true; 
 
      } 
 
     } 
 
     ]) 
 
    </script> 
 
</body> 
 

 
</html>

0

Установите значение базы данных к области приписано ничего , для например: model и использовать ng-show и ng-hide директивы, чтобы показать/скрыть код HTML

<i ng-show="model" class="fa fa-check"></i> or if NO this: <i class="fa fa-times"></i> 
<i ng-hide="model" class="fa fa-check"></i> or if NO this: <i class="fa fa-times"></i> 
1

Вы можете сделать это с помощью ngClass

Попробуйте нравится эта

<i class="fa fa-check" ng-class="{'fa-check' : myModel=='YES' , 'fa-times' : myModel=='NO' }"></i> 
Смежные вопросы