JSFiddle - React, Tailwind, and code Playground

by philsitumorang

HTML

<div ng-app="fuckApp">
  <div ng-controller="ShitController">
  
    <div class="user" ng-repeat="user in users"> <!-- Тут мы проходим по нашему массиву -->
        <a href="#">{{ user.email }}</a> <!-- Вставляем значение из user.email -->
        <div ng-click="setStatus(user)"> <!-- Вместо .on() или onclick используем ангуляровский click по элементу, чтобы использовать его внутри структуры angular -->
            <!-- условия того, что показывать будем -->
            <div class="set-status" ng-if="user.active">Активен</div>
            <div class="set-status" ng-if="!user.active">Забанен</div>
        </div>
        <div class="posts-count">{{ user.posts_count }}</div>
    </div>
  
  </div>
</div>

JavaScript

var users = [
    {
        email: 'john@weak.com',
        active: true,
        posts_count: 24
    },
    {
        email: 'nil@amstrong.com',
        active: false,
        posts_count: 11
    },
    {
        email: 'mike@v.coms',
        active: true,
        posts_count: 1
    }
];

// angular

angular.module('fuckApp', []).controller('ShitController', function($scope) {
	$scope.users = users;
  
  $scope.setStatus = function(user) {
    if (user.active)
    	user.active = false;
    else
			user.active = true;
  }
})