JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<div ng-app ng-controller="myCtrl" class="col-lg-12">
    <div class="input-group">
        <input type="text" class="form-control" ng-class="show ? '' : 'rounded'" placeholder="Recipient's username" aria-describedby="basic-addon2"> <span class="input-group-addon" id="basic-addon2" ng-show="show">@example.com</span>

</div>

CSS

.input-group{
    width: 100%;
    border-radius: 5px;
    overflow: hidden;
}

JavaScript

function myCtrl($scope) {
    $scope.show = true;
}