I do project with spring mvc and angularjs. I query data encrypt store in json using #ResponseBody as shown below:
#RequestMapping("getEmpListRB")
public #ResponseBody String getEmpListsRB() throws Exception {
ObjectMapper mapper = new ObjectMapper();
List<EmployeeTest> employeeList = new ArrayList<EmployeeTest>();
employeeList = dataService.getList();
String jsonInString = mapper.writeValueAsString(employeeList);
String encryptData = AES.encrypt(jsonInString);
return encryptData;
}
when i run project access url(url/getEmpListRB) like this i got data like below:
V70kQm5oilgPr/VdmGqEv3Lkg7P/lSWccjs6F/scOuIiR/NAM7dXMtmYrliW5Nc1g8TQEEZ7m2g8 9TrlJBIbr6iyvAHD/q+l8rzGfR6hYDLl61VhxrTMYsCgVVPPyBUiBKaoJJvC/MsJTv8HV61ZiZe9 NGziNQNt9HF/k40RzlGsfWtSibVrGTxbhYue45QSSNIjKHg0bA3+El431tyBgMbd1/mPxdSdJpMQ F4H230eiH8tnALC2pKaDDlTEDt7MpkR9V0V7ovQf2aCwOVRzShydm2kAxv1W54zLjggTIlXA1Eb6 ywkcdS6eN7Wzci+DFIJKX2r0KjMIvnKR5ij7OsnoxUPrU2bdqMwAiE0Ld1J0DixMYmrsiyj3qTOL GO8qodDNt6FcW1jfOMqzMbH11uxDp1LJAdfJ8xlBDrrOrSmKmWN9vHLCF8zXm17MAHpVt+S4GneA 8nL2fu+O4t+JjEupoIXjZsf5bBngkNB/m02/lH/HHL2sc33uKKTgdBkt+nk9QjlQeIvIPcV5dPPe rkPkxCJPSVPjomoVWkjuBonaj5DtFqRufjnNVfl5ZmZjnhG3ewN0kYHJKGGC4jFLobykQT5C9qxK V5R8z+czZGer8JHwqpfwVpLnQRvbMi7pLj2lR7j7hCzZhQu1HKXB89V4+1Vf/ZlwmlvZ/TU12uxG 0L8pPfvk5NK6e55UKz6ZFNWCIXJmKcySlwIHNIkK0Ygm+NWofxR9HnuJzzruJqIbKCMcbebCHm5f p64MchTlIvRsu72NHzJWys9gdT2GFgBMVj9d5gSnDJlvrnpxP5MEcUNo/datc9Gk38dntlweqqcj WmUuChbSGw70AnuKd2/lAZuNhMec6kw+MfYYo3yijnepyJKEV6ykeoERzhDtZpyWcjYGxyWMjb2X g7VMm+KXCyiVhI9+gMETPKgI5M7sAYlLI7tj6J/WcOWCuHgCzNKDYADriSL9DRBk/trVZrqUwsKP wgjutw6vVtL9mI7ojLa8GkDu47dqCeGNdfzSf0043Im3ypVu+442usN4bpgf3rHdujaxcs0G+j0y cYKniLywXiHtVpT8IfWVNjc3PgaFKW1QTqsJC3AVefVqKt9944bKRif3uu7dqXLw5L7WpWF0I+qK EBv9MbeiNEO3BzNNfpdeoJusG0wuZ9AB3MZgMGMGwg4rDuDBsjI5x+vtjr+8voKZuDBzhx1/6xOp C6QqMC6gG9rkI69uLfT/OIf/X0RB4mlxRti7EPVDg4Oe+KTfH/S07Ce0O6DnL3Q78l7/UoW8iowg 1RTtSTwCaI9JQjA5c0oTEXcUH1aYcOjUbynwIUKznFZpMTJOq9YqORudQ09rlyfHQImdgsWa1RCL YAC80Nzd/0NV2t4hjf13ZvJ3Z68GZaFwqLOWrAV1XYM4N35z9MYwKx1CzVN5bITB7KAMnfmyAEKx H+0N9cRvbtaZjbKJ0z5O7vvnnISbRreMQ+Xg838tk9w7A8Dm3w==
and then i use angularjs like below for alert encrypt data but i can't alert it please help me!
<!DOCTYPE html>
<html data-ng-app="formSubmit">
<head>
<meta charset="ISO-8859-1">
<title>AngularJS Post Form Spring MVC example</title>
<!-- <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js"></script> -->
<script src="${pageContext.request.contextPath}/resources/js/angular.min.js"></script>
<script type="text/javascript">
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
$http.get("http://" + location.host + "/MdrWebService/getEmpListRB").success(function (response) {
$scope.names = response;
alert(JSON.stringify(response));
});
});
</script>
</head>
<body>
<div ng-app="myApp" ng-controller="customersCtrl">
</div>
</body>
</html>
Related
I am trying to fetch data from REST API but it results blank.
index.html
<html ng-app="demo">
<head>
<title>Hello AngularJS</title>
<script src="jquery.min.js"></script>
<script src="angular.min.js"></script>
<script src="hello.js"></script>
</head>
<body>
<div ng-controller="Hello">
<p>The ID is {{greeting.id}}</p>
<p>The content is {{greeting.content}}</p>
</div>
</body>
</html>
hello.js
angular.module('demo', [])
.controller('Hello', function($scope, $http) {
$http.get('http://rest-service.guides.spring.io/greeting').
then(function(response) {
$scope.greeting = response.data;
});
});
output:
The ID is
The content is
ID and content is still missing. Any help please?
Edit:(FIX) Problem was with a plugin installed in the browser, which weren't allowing web service. Thanks everyone.
Well Seems like your api return following response:
{
"id": 879,
"content": "Hello, World!"
}
try fetching response.content for accessing message
I tried to run your code in my local. I observed that if you replace http from https in you request, it wont work. Try to run this from file protocol in your browser and it will work as shown in the picture.
Also the api you mentioned is now working over HTTPS.
Edit your controller with following one
angular.module('demo', [])
.controller('Hello',
function ($scope, $http) {
var callMethod = function() {
$http.get('http://rest-service.guides.spring.io/greeting')
.then(function(response) {
$scope.greeting = response.data;
alert($scope.greeting.id);
alert($scope.greeting.content);
},
function(error) {
console.log(error);
});
}
callMethod();
});
Using $http.get() on a json file, but the response is the HTML code to the page I am using. That is, console.log(response) prints the entire test.html file.
main.js is ran on nodejs, which loads test.html. test.html then should load test.json. The console.log('here') prints and $scope.hello is set and displays correctly.
main.js
var http = require("http");
var fs = require('fs');
http.createServer(function (request, response) {
var data = fs.readFile('test.html', function(err,data) {
response.writeHead(200, {'Content-Type': 'text/html'});
response.write(data);
response.end();
});
}).listen(8081);
test.html
<!DOCTYPE html>
<html ng-app="App">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js">
</script>
<script>
angular.module('App', []).controller('Ctrl',
function($scope, $http) {
console.log('here');
$http.get('test.json').success(function(response) {
console.log(response);
$scope.hello = "hi guys";
});
}
);
</script>
</head>
<body>
<div ng-controller="Ctrl">
<p>{{hello}}</p>
</div>
</body>
</html>
test.json
{ "papers" :[
{
"authors":"Zubrin, Robert M.; Baker, David A.; Gwynne, Owen",
"title":"Mars Direct: A Simple, Robust, And Cost Effective Architecture For The Space Exploration Initiative",
"titleLink":"http://www.marspapers.org/papers/Zubrin_1991.pdf",
"abstractName":"Abstract",
"abstractLink":"http://www.marspapers.org/abstr/Zubrin_1991abstr.htm",
"year":"1991",
"category":"MissionEngring",
"publcation":""
}
]}
Your server is specifically programmed to return the contents of test.html regardless of what is requested. You need to actually inspect request and serve the appropriate file.
I have an API (http://localhost:5000/v2/_catalog) returning a json structure as follows:
{
"repositories":
[
"start/imageA",
"start/imageA"
]
}
Now I want to parse the result with ng-admin. My admin.js (CORS is solved on my webserver) looks as follows:
var myApp = angular.module('r2ui', ['ng-admin']);
myApp.config(['RestangularProvider', function(RestangularProvider) {
RestangularProvider.addFullRequestInterceptor(function(element, operation, what, url, headers, params, httpConfig) {
delete params._page;
delete params._perPage;
delete params._sortDir;
delete params._sortField;
return { params: params };
});
}]);
myApp.config(['NgAdminConfigurationProvider', function (nga) {
var admin = nga.application('Registry v2 UI')
.baseApiUrl('http://localhost:8081/v2/'); // main API endpoint
var catalog = nga.entity('_catalog');
catalog.listView().fields([
nga.field('repositories', 'embedded_list')
.targetEntity(nga.entity('repositories'))
.targetFields([
nga.field('.').isDetailLink(true),
nga.field('.').label('Repository')
])
.listActions(['edit'])
]);
admin.addEntity(catalog);
nga.configure(admin);
}]);
How can this be achieved?
Update below
Sorry I omitted the file index.html cause I thought it is to obvious to mention:
<head>
<meta charset="utf-8">
<title>Registry v2 UI</title>
<link rel="stylesheet" href="node_modules/ng-admin/build/ng-admin.min.css">
</head>
<body ng-app="r2ui">
<div ui-view></div>
<script src="node_modules/ng-admin/build/ng-admin.min.js" type="text/javascript"></script>
<script src="admin.js" type="text/javascript"></script>
</body>
</html>
The question is still the same. The array is not parsed correctly and I do not find in the documentation how this could be achieved with the given json.
I've got the same problem, and I finally solved it by set the field type to "choices".
In your case, try to change:
nga.field('repositories', 'embedded_list')
to:
nga.field('repositories', 'choices')
I am having trouble setting up ng-view. This is my first mean stack app. I got everything working within index.html. However, when I set up ng-view I am getting errors stating that I have my javascripts in a public folder. My index.html is in the html folder. I have set up an additional folder in views called templates to house my additional pages
"GET http://localhost:3000/templates/home.html 500 (Internal Server Error)"
Inside of my html I have set up ng-view
<!doctype html>
<html lang="en" ng-app='myApp'>
<head>
<meta charset="UTF-8">
<title>Caffeine app</title>
<!-- styles -->
<link href="http://netdna.bootstrapcdn.com/bootswatch/3.3.2/yeti/bootstrap.min.css" rel="stylesheet" media="screen">
<link href="stylesheets/style.css" rel="stylesheet" media="screen">
</head>
<body>
<div class="container>
<div ng-view>
</div>
</div>
<!-- scripts -->
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<script src="libs/angular/angular.min.js"></script>
<script src="libs/angular-route/angular-route.min.js"></script>
<script src="javascripts/main2.js" type="text/javascript"></script>
</body>
</html>
In my public js folder I have set up my factory, config, and controllers. I am using swig.
var app = angular.module('myApp', ['ngRoute'], function ($interpolateProvider) {
$interpolateProvider.startSymbol('[[');
$interpolateProvider.endSymbol(']]');
});
app.config(function($routeProvider,$locationProvider){
$routeProvider
.when('/home',{
templateUrl:'templates/home.html',
controller:'myController'
})
.when('/drinkLibrary',{
templateUrl:'templates/drinkLibrary.html',
controller:'DrinkLibraryController'
})
.otherwise({
redirectTo: '/home'
})
$locationProvider.hashPrefix('!');
});
app.factory('Drink',function($http) {
var Drink = function(name,description,caffeineLevel) {
this.name = name;
this.description = description;
this.caffeineLevel = caffeineLevel;
}
return Drink;
})
app.controller('HomeController',function($scope){
console.log('home');
})
app.controller('DrinkLibraryController',function($scope){
console.log('drinkLibrary');
})
app.controller('myController', function($scope,Drink,$http ) {
var init = function() {
$scope.defaultForm = {
beverageName: "",
description: "",
caffeine: ""
};
}
init();
// $scope.defaultForm = defaultForm;
$scope.allDrinkList = [];
$scope.drinkList= function(obj) {
var newdrink = new Drink(obj.beverageName,obj.description,obj.caffeine);
$scope.allDrinkList.push(newdrink);
console.log($scope.allDrinkList);
init();
$http.post('/api/drinks',obj).
success(function(data){
console.log(data)
$scope.message = 'success';
}).
error(function(data){
console.log('error');
})
};
});
Inside of my routes folder I am making sure to render the index
var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res, next) {
res.render('index');
});
module.exports = router;
In doing a mean stack I must remember to set up routes on the server and client side. My templates are in the view. I am rendering my view through express I need to also render my templates in the same manner.
app.use('templates/:templateid', routes);
I am using the express generator so through the routes I called a get request and set the url to the templates folder. Next, I identified the template id as a param. This saves me from setting up each page ex(home,library, about).
router.get('/templates/:templateid' ,function(req,res,next){
res.render('templates/' + req.params.templateid);
})
I am trying to call the Alchemy REST API using Angular js. I am embedding the js in HTML and I have posted the code that I am using below.I am trying to display the JSON from the REST API on the HTML page, but I am not getting anything on the page currently. Please let me know what I am doing wrong?
I am new to Javascript and Angular js.
HTML code :-
<!DOCTYPE html>
<!--View-->
<html ng-app="myApp">
<head>
<meta charset="ISO-8859-1">
<title>Using Angular JS</title>
</head>
<body>
<div data-ng-controller="AngularJSCtrl">
<input type="text" data-ng-model="name"/>
Data from server:
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular-resource.min.js"></script>
<script>
var myApp = angular.module('myApp',[]);
<!--Service>
myApp.service('dataService', function($http) {
delete $http.defaults.headers.common['X-Requested-With'];
this.getData = function() {
// $http() returns a $promise that we can add handlers with .then()
return $http({
method: 'GET',
url: 'http://access.alchemyapi.com/calls/text/TextGetTextSentiment',
params: 'text=I am taking my insurance and I have heard great things abot nationwide, outputmode=json',
headers: {'Authorization': 'Token token=ee5379eaf38a3e7931f8f4db39984d6efaf2c75c'}
});
}
});
<!--Controller>
myApp.controller('AngularJSCtrl', function($scope, dataService) {
$scope.data = null;
dataService.getData().then(function(dataResponse) {
$scope.data = dataResponse;
console.log('The return value is:' + dataResponse);
});
});
</script>
</body>
</html>