JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://code.angularjs.org/angular-1.0.0rc4.js"></script>
<script src="http://code.angularjs.org/1.0.0rc4/angular-resource-1.0.0rc4.js"></script>
<div ng-app="myApp">
<div ng-controller="MyController">
<button ng-click="select('[email protected]')">Select</button>
<div ng-show="selectedPlayer != null">
<h1>Selected Player</h1>
<table>
<tr><td>Email</td><td>{{selectedPlayer.email}}</td></tr>
<tr><td>Fuel</td><td>{{selectedPlayer.fuel}}</td></tr>
<tr><td>Cargo</td><td>{{selectedPlayer.cargo}}</td></tr>
<tr><td>Food</td><td>{{selectedPlayer.food}}</td></tr>
</table>
</div>
</div>
</div>
CSS
.ng-invalid { border: 2px solid red; }
JavaScript
var module = angular.module('myApp', ['ngResource']);
module.factory('Player', ['$resource', function($resource) {
return $resource('/player/get');}]);
module.controller('MyController', ['$scope', 'Player', function($scope, Player) {
$scope.select = function(email) {
console.log("selecting");
Player.get({
email: email
}, function(palyer) {
$scope.selectedPlayer = player;
});
};
}]);