JSFiddle - React, Tailwind, and code Playground

by Ankit Patidar

HTML

<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<div ng:app="myApp">
 <div ng-controller="HelloCntl">
 <ul>
    <li ng-repeat="friend in friends">
        <span ng-bind-html="friend.name | customFilter"></span>
        <span>{{friend.phone}}</span>
    </li>
 </ul>
 </div>
</div>

JavaScript

var app = angular.module('myApp', []) .filter('customFilter', function ($sce) {
            return function (number) {
                if (isNaN(number) || number > 1) {
                    return number;
                } else {
                    if (number === 1 ) {
                        return $sce.trustAsHtml("&#x2714;");
                    } else if (number === 0) {
                        return $sce.trustAsHtml("&#x2718;");
                    }
                }
            }
        });

function HelloCntl($scope) {
    $scope.friends = [
        {
        name: 0,
        phone: '555-1276'},
    {
        name: 0,
        phone: '800-BIG-MARY'},
    {
        name: 1,
        phone: '555-4321'},
    {
        name: 2,
        phone: '555-5678'},
    {
        name: 2,
        phone: '555-8765'}
    ];
}
// Controller for Nav
app.controller('NavController', function ($scope,$http) {
		

   $scope.saveChanges=function(){
            alert($scope.company);

    };
    
    
});