hey actually i am new to node and angularjs and i am doing a project on node and angularjs i have a client and server node server is running on a port 3001 and client is running on 3000 whenever i run my server i will get a data in a json format but that data is not in a correct json format here is the data i am receiving from the server
"color :\r\n white : &color-white \"#FFFFFF\"\r\n black : &color-black
\"#262626\"\r\n neutral :\r\n 20 : &color-neutral-20 \"#222222\"\r\n
90 : &color-neutral-90 \"#EEEEEE\"\r\n blue:\r\n 50: &color-blue-50
\"#0000ff\"\r\n 90: &color-blue-60 \"#3333ff\"\r\n red:\r\n 50:
&color-red-90 \"#ff0000\"\r\n 95: &color-red-90 \"#ff8080\"\r\n
Green:\r\n 40: &color-green \"#00cc00\"\r\n 80: &color-green
\"#99ff99\"\r\n Pink:\r\n 80: &color-pink \"#ff99cc\"\r\n 30: &color-
pink \"#ff0080\"\r\n Yellow:\r\n 70: &color-yellow \"#ffff66\"\r\n
40: &color-yellow \"#ffff00\"\r\n\r\n border:\r\n brand: &color-border-
brand \"#1589ee\"\r\n brand-dark: &color-border-brand-dark
\"#0070d2\"\r\n customer: &color-border-customer \"#ff9a3c\"\r\n
destructive: &color-border-destructive \"#c23934\"\r\n destructive-hover:
&color-border-destructive-hover \"#a61a14\"\r\n\r\n\r\n interactive-color
:\r\n default: *color-blue-50\r\n dark: *color-blue-60\r\n\r\n
background-color :\r\n default : *color-white\r\n light : *color-
neutral-90\r\n dark : *color-neutral-20\r\n disabled: *color-neutral-
90\r\n\r\n text-color :\r\n default : *color-neutral-20\r\n on-light
: *color-neutral-20\r\n on-dark : *color-white\r\n light : *color-
neutral-20\r\n disabled : *color-neutral-20\r\n link :\r\n
default : *color-blue-50\r\n on-dark : *color-white\r\n\r\nfont:\r\n
family:\r\n text: &font-family-text \"Salesforce Sans\"\r\n heading:
&font-family-heading \"Arial\"\r\n\r\n weight:\r\n light: &font-weight-
light \"300\"\r\n regular: &font-weight-light \"300\"\r\n bold: &font-
weight-light \"300\"\r\n\r\n size:\r\n xx-small: &font-size-text-xx-
small \".625rem FONT_SIZE_1 10px\"\r\n x-small: &font-size-text-x-small
\".75rem FONT_SIZE_2 12px\"\r\n small: &font-size-text-small \".8125rem
FONT_SIZE_3 13px\"\r\n medium: &font-size-text-medium \".1rem FONT_SIZE_5
16px\"\r\n large: &font-size-text-large \"1.125rem FONT_SIZE_6 18px\"\r\n
x-large: &font-size-text-x-large \"1.25rem FONT_SIZE_7 20px\"\r\n\r\n line-
height:\r\n heading: &line-height-heading \"1.25\"\r\n text: &line-
height-text \"1.5\"\r\n reset: &line-height-reset \"1\"\r\n tab:
&line-height-tab \"2.5rem 40px\"\r\n button: &line-height-button
\"1.875rem 30px\"\r\n button-small: &line-height-button-small \"1.75rem
28px\"\r\n\r\nspace :\r\n default : 16px\r\n xxs: 2px\r\n xs: 4px\r\n s:
8px\r\n m: 16px\r\n l: 32px\r\n xl: 64px\r\n inset :\r\n default :
16px 16px 16px 16px\r\n xxs : 2px 2px 2px 2px\r\n xs : 4px 4px 4px
4px\r\n s : 8px 8px 8px 8px\r\n m : 16px 16px 16px 16px\r\n l :
32px 32px 32px \n"
i need to display this data in client side like design token format for ex color-blue, color-white, color-black etc here is my angularjs code to receive the out put
angular.module('design',[]).controller('designController',
function($scope,$http)
{
$scope.message="hii";
console.log(":outside");
$http.get('http://rest-
service.guides.spring.io/greeting').then(function(response)
{
console.log("inside");
$scope.greeting = Json.stringify(response.data);
});
});
this is my index.html
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8" />
<link
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
rel="stylesheet">
<script
src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.2/angular.js">
</script>
</head>
<body ng-app="design" class="container">
<br/>
<br />
<br />
<div class="row" style="background-color:purple;">
<font color="white">ellucian University</font>
</div>
<br/>
<br/>
<div class="row">
<div class="col-sm-4">
<font color="purple">Design Tokens</font>
</div>
<div class="col-sm-8" align="right">
<input type="button"class="btn btn-primary" value="download" />
<input type="button" class="btn btn-primary" value="Save" />
</div>
<br/>
<br/>
</div>
<div ng-controller="designController" class="row">
<div class="col-sm-4">
<font color="purple">Tokens</font><br/>
<li ng-repeat = "item in greeting track by $index">
</li>
</body>
</html>
please help me with this
via Sushma
No comments:
Post a Comment