<div id="wrapper" ng-app>
<div ng-controller="DataCtrl">
<pre ng-model="data">
{{data}}
</pre>
<input ng-model='name' />
{{name}}
<input ng-model='salutation' />
{{salutation}}
<input ng-model='greeting' />
{{greeting}}
</div>
</div>
#wrapper {
width: 720px;
margin: 0 auto;
}
angular.module('', []);
function DataCtrl($scope, $http) {
$http.jsonp("https://angularjs.org/greet.php?callback=JSON_CALLBACK&name=Super%20Hero").
success(function(data) {
$scope.data = data;
$scope.name = data.name;
$scope.salutation = data.salutation;
$scope.greeting = data.greeting;
$("[ng-model='nameNew']").val(data.name);
$("[ng-model='salutation']").val(data.salutation);
$("[ng-model='greeting']").val(data.greeting);
}).
error(function (data) {
$scope.data = "Request failed";
});
}
This Pen doesn't use any external CSS resources.