williandrade/index.html

## index.html
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<script src="http://code.jquery.com/jquery.min.js"></script>
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<meta name="description" content="Tags">
<script src="http://code.jquery.com/jquery-git.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body ng-controller="myCtrl">

  <div class="row">
    <div class="col-xs-6">
      <textarea ng-model="text" ng-change="change()"></textarea>
    </div>
    <div class="col-xs-3">
      <p ng-repeat="tag in tags" ng-class="{'text-danger': myFilter(tag)}">{{tag.nome}}</p>
    </div>
    <div class="col-xs-3">
      <p ng-repeat="allTag in allTagsUse">
        {{allTag.nome}}
      </p>
    </div>
  </div>


<script id="jsbin-javascript">
var app = angular.module('myApp',[]);
app.controller('myCtrl', function($scope){
  $scope.allTagsUse = [
    {
      tagName: '<&teste />',
      nome: 'teste'
    },
    {
      tagName: '<&teste2 />',
      nome: 'teste2'
    }
  ];

  var regForGetTag = new RegExp('<&[\\w]* />|<&(\\w)* (\\w)* />', 'g');

  $scope.change = function(){
    var allTags = $scope.text.match(regForGetTag);
    $scope.tags = [];
    angular.forEach(allTags, function(value, key){
      $scope.tags.push({
        tagName: value,
        nome: value.split(/<&|\/>/)[1]
      });
    });
  };

  $scope.myFilter = function(text) {
    for (var i = 0; i < $scope.allTagsUse.length; i++) {
      if (text.tagName == $scope.allTagsUse[i].tagName) {
        return true;
      }
    }
    return false;
  };
});
</script>

<script id="jsbin-source-html" type="text/html"><!DOCTYPE html>
<html ng-app="myApp">
<head>
<script src="//code.jquery.com/jquery.min.js"><\/script>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"><\/script>
<meta name="description" content="Tags">
<script src="//code.jquery.com/jquery-git.js"><\/script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"><\/script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body ng-controller="myCtrl">

  <div class="row">
    <div class="col-xs-6">
      <textarea ng-model="text" ng-change="change()"></textarea>
    </div>
    <div class="col-xs-3">
      <p ng-repeat="tag in tags" ng-class="{'text-danger': myFilter(tag)}">{{tag.nome}}</p>
    </div>
    <div class="col-xs-3">
      <p ng-repeat="allTag in allTagsUse">
        {{allTag.nome}}
      </p>
    </div>
  </div>


</body>
</html></script>


<script id="jsbin-source-javascript" type="text/javascript">var app = angular.module('myApp',[]);
app.controller('myCtrl', function($scope){
  $scope.allTagsUse = [
    {
      tagName: '<&teste />',
      nome: 'teste'
    },
    {
      tagName: '<&teste2 />',
      nome: 'teste2'
    }
  ];

  var regForGetTag = new RegExp('<&[\\w]* />|<&(\\w)* (\\w)* />', 'g');

  $scope.change = function(){
    var allTags = $scope.text.match(regForGetTag);
    $scope.tags = [];
    angular.forEach(allTags, function(value, key){
      $scope.tags.push({
        tagName: value,
        nome: value.split(/<&|\/>/)[1]
      });
    });
  };

  $scope.myFilter = function(text) {
    for (var i = 0; i < $scope.allTagsUse.length; i++) {
      if (text.tagName == $scope.allTagsUse[i].tagName) {
        return true;
      }
    }
    return false;
  };
});</script></body>
</html>

## jsbin.gavamu.js
var app = angular.module('myApp',[]);
app.controller('myCtrl', function($scope){
  $scope.allTagsUse = [
    {
      tagName: '<&teste />',
      nome: 'teste'
    },
    {
      tagName: '<&teste2 />',
      nome: 'teste2'
    }
  ];

  var regForGetTag = new RegExp('<&[\\w]* />|<&(\\w)* (\\w)* />', 'g');

  $scope.change = function(){
    var allTags = $scope.text.match(regForGetTag);
    $scope.tags = [];
    angular.forEach(allTags, function(value, key){
      $scope.tags.push({
        tagName: value,
        nome: value.split(/<&|\/>/)[1]
      });
    });
  };

  $scope.myFilter = function(text) {
    for (var i = 0; i < $scope.allTagsUse.length; i++) {
      if (text.tagName == $scope.allTagsUse[i].tagName) {
        return true;
      }
    }
    return false;
  };
});
	<!DOCTYPE html>
	<html ng-app="myApp">
	<head>
	<script src="http://code.jquery.com/jquery.min.js"></script>
	<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
	<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
	<meta name="description" content="Tags">
	<script src="http://code.jquery.com/jquery-git.js"></script>
	<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"></script>
	<meta charset="utf-8">
	<title>JS Bin</title>
	</head>
	<body ng-controller="myCtrl">

	<div class="row">
	<div class="col-xs-6">
	<textarea ng-model="text" ng-change="change()"></textarea>
	</div>
	<div class="col-xs-3">
	<p ng-repeat="tag in tags" ng-class="{'text-danger': myFilter(tag)}">{{tag.nome}}</p>
	</div>
	<div class="col-xs-3">
	<p ng-repeat="allTag in allTagsUse">
	{{allTag.nome}}
	</p>
	</div>
	</div>




	<script id="jsbin-javascript">
	var app = angular.module('myApp',[]);
	app.controller('myCtrl', function($scope){
	$scope.allTagsUse = [
	{
	tagName: '<&teste />',
	nome: 'teste'
	},
	{
	tagName: '<&teste2 />',
	nome: 'teste2'
	}
	];

	var regForGetTag = new RegExp('<&[\\w]* />\|<&(\\w)* (\\w)* />', 'g');

	$scope.change = function(){
	var allTags = $scope.text.match(regForGetTag);
	$scope.tags = [];
	angular.forEach(allTags, function(value, key){
	$scope.tags.push({
	tagName: value,
	nome: value.split(/<&\|\/>/)[1]
	});
	});
	};

	$scope.myFilter = function(text) {
	for (var i = 0; i < $scope.allTagsUse.length; i++) {
	if (text.tagName == $scope.allTagsUse[i].tagName) {
	return true;
	}
	}
	return false;
	};
	});
	</script>

	<script id="jsbin-source-html" type="text/html"><!DOCTYPE html>
	<html ng-app="myApp">
	<head>
	<script src="//code.jquery.com/jquery.min.js"><\/script>
	<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
	<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"><\/script>
	<meta name="description" content="Tags">
	<script src="//code.jquery.com/jquery-git.js"><\/script>
	<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"><\/script>
	<meta charset="utf-8">
	<title>JS Bin</title>
	</head>
	<body ng-controller="myCtrl">

	<div class="row">
	<div class="col-xs-6">
	<textarea ng-model="text" ng-change="change()"></textarea>
	</div>
	<div class="col-xs-3">
	<p ng-repeat="tag in tags" ng-class="{'text-danger': myFilter(tag)}">{{tag.nome}}</p>
	</div>
	<div class="col-xs-3">
	<p ng-repeat="allTag in allTagsUse">
	{{allTag.nome}}
	</p>
	</div>
	</div>




	</body>
	</html></script>


	<script id="jsbin-source-javascript" type="text/javascript">var app = angular.module('myApp',[]);
	app.controller('myCtrl', function($scope){
	$scope.allTagsUse = [
	{
	tagName: '<&teste />',
	nome: 'teste'
	},
	{
	tagName: '<&teste2 />',
	nome: 'teste2'
	}
	];

	var regForGetTag = new RegExp('<&[\\w]* />\|<&(\\w)* (\\w)* />', 'g');

	$scope.change = function(){
	var allTags = $scope.text.match(regForGetTag);
	$scope.tags = [];
	angular.forEach(allTags, function(value, key){
	$scope.tags.push({
	tagName: value,
	nome: value.split(/<&\|\/>/)[1]
	});
	});
	};

	$scope.myFilter = function(text) {
	for (var i = 0; i < $scope.allTagsUse.length; i++) {
	if (text.tagName == $scope.allTagsUse[i].tagName) {
	return true;
	}
	}
	return false;
	};
	});</script></body>
	</html>