JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<link rel="stylesheet" href="http://vitalets.github.io/angular-xeditable/dist/css/xeditable.css">
<script src="http://vitalets.github.io/angular-xeditable/dist/js/xeditable.js"></script>
<h4>Angular-xeditable demo</h4>

<div ng-app="app" ng-controller="Ctrl" style="margin: 50px">
    <p>
        <span e-name="item" editable-select="row.item" e-ng-options="item.id as item.name for item in items">{{ getUser(items, row.item).name }}</span> 
    </p>
    
    <pre>{{ getUser(items, row.item) | json }}</pre>
</div>

JavaScript

var app = angular.module("app", ["xeditable"]);

app.run(function (editableOptions) {
    editableOptions.theme = 'bs3';
});

app.controller('Ctrl', function ($scope) {

    $scope.items = [{id: 0, name: 'Igor'}, {id: 1, name: 'Misko'}, {id: 2, name: 'Brad'}];
    
    $scope.row = {
        item: 1
    };
    
    $scope.getUser = function (users, userId) {
    	return users.find(function (user) {
            return user.id === userId;
        });
    }
});