download :
https://github.com/btford/angular-express-seed
for lib only.
Step2: replace Package Json. otherwise get body-parser error:
"dependencies": { "anchor": "~0.10.5", "async": "1.5.0", "captains-log": "~0.11.11", "colors": "1.1.2", "commander": "2.9.0", "compression": "1.5.2", "connect": "2.30.0", "connect-flash": "0.1.1", "consolidate": "0.12.1", "cookie": "0.1.2", "cookie-parser": "1.3.5", "cookie-signature": "1.0.6", "ejs": "2.3.4", "ejs-locals": "1.0.2", "express": "3.21.2", "express-handlebars": "3.0.0", "express-session": "1.12.1", "fs-extra": "0.18.4", "glob": "5.0.15", "grunt": "0.4.5", "grunt-cli": "0.1.13", "grunt-contrib-clean": "0.6.0", "grunt-contrib-coffee": "0.13.0", "grunt-contrib-concat": "0.5.1", "grunt-contrib-copy": "0.5.0", "grunt-contrib-cssmin": "0.9.0", "grunt-contrib-jst": "0.6.0", "grunt-contrib-less": "1.1.0", "grunt-contrib-uglify": "0.7.0", "grunt-contrib-watch": "0.5.3", "grunt-sails-linker": "~0.10.1", "grunt-sync": "0.2.4", "i18n": "0.8.1", "include-all": "~0.1.6", "lodash": "3.10.1", "lodash.isarray": "3.0.4", "lodash.iserror": "3.1.1", "lodash.isfunction": "3.0.8", "lodash.isnull": "3.0.0", "lodash.isobject": "3.0.2", "lodash.isregexp": "3.0.5", "lodash.isstring": "3.0.1", "lodash.isundefined": "3.0.1", "merge-defaults": "~0.2.1", "method-override": "2.3.5", "mock-req": "0.2.0", "mock-res": "0.3.0", "parseurl": "1.3.1", "pluralize": "1.2.1", "prompt": "0.2.14", "rc": "1.0.1", "reportback": "~0.1.9", "rttc": "9.3.3", "sails-build-dictionary": "~0.10.1", "sails-disk": "~0.10.9", "sails-generate": "~0.13.0", "sails-hook-orm": "~1.0.6", "sails-hook-sockets": "~0.13.0", "sails-stringfile": "~0.3.2", "sails-util": "~0.11.0", "semver": "5.1.0", "serve-favicon": "2.3.0", "serve-static": "1.10.2", "skipper": "~0.5.8", "uid-safe": "1.1.0", "walk": "2.3.9", "waterline": "~0.11.0"}
Step 3:
run below command:
npm install body-parser
npm install express
npm install error-handler
npm install morgan
npm install method-override
npm install
node app.js
Step 4: now you can add your Jade .
like partail3; for gui- grid
p This is the partial for view 1. div(ng-controller='MyCtrl3') h2 Hello {{name}} h2 Stock prices for: {{symbol}} label(for='symbol') Stock symbol: input(name='symbol', type='text', ng-model='symbol', ng-change='getData()') label(for='start') Start date: input(name='start', type='text', ng-model='startDate', ng-change='getData()') label(for='end') End date: input(name='end', type='text', ng-model='endDate', ng-change='getData()') label(for='method') Lookup method select(ng-model='method', ng-options='o.value for o in options') p .grid(ui-grid='gridOptions') p p h2 price wise {{symbol}} .grid(ui-grid='gridOptionsprice')
Step 4: Add new controller into controller.js
'use strict'; /* Controllers */ angular.module('myApp.controllers', []). controller('AppCtrl', function ($scope, $http) { $http({ method: 'GET', url: '/api/name' }). success(function (data, status, headers, config) { $scope.name = data.name; }). error(function (data, status, headers, config) { $scope.name = 'Error!'; }); }). controller('MyCtrl1', function ($scope) { // write Ctrl here $scope.name ="ashok"; }). controller('MyCtrl3', function ($scope,service) { // write Ctrl here $scope.name ="Testing by Ashok"; $scope.gridOptions =[]; $scope.gridOptionsprice =[]; $scope.symbol = "^VIX"; $scope.items = []; $scope.startDate = '2015-03-01'; var date = new Date(); var month = new Date(date); month.setMonth(date.getMonth()+1); var monthnum = null; monthnum = month.getMonth(); if(month.getMonth().toString().length <2 ) monthnum ="0"+ month.getMonth() $scope.endDate = '2016-12-06'; $scope.options = [{ value: '$q'}, { value: 'callback'}, { value: 'watch'}]; $scope.method = $scope.options[0]; $scope.$watch(function combinedWatch() { return { symbol: $scope.symbol, startDate: $scope.startDate, endDate: $scope.endDate, method: $scope.method }; }, function(value) { if (value.symbol && value.startDate && value.endDate && value.method) { console.log('Start updating ' + JSON.stringify(value)); $scope.items = []; if ($scope.method.value === '$q') { var promise = service.getHistoricalDataWithQ($scope.symbol, $scope.startDate, $scope.endDate); promise.then(function(data) { $scope.items = data; $scope.gridOptions.data = $scope.items; // $scope.loaddetailsdata($scope.items, $scope); }); } if ($scope.method.value === 'callback') { service.getHistoricalDataWithCallback(function(data) { $scope.items = data; }, $scope.symbol, $scope.startDate, $scope.endDate); } if ($scope.method.value === 'watch') { $scope.items = service.getHistoricalDataWithWatch($scope.symbol, $scope.startDate, $scope.endDate); } } }, true); $scope.loaddetailsdata = function(rowdata,$scope) { var details = []; var detailsgrid = []; var details = $scope.sortBy(rowdata ,{prop : "date"}); var lowestvalue = $scope.sortBy(rowdata ,{prop : "Low"})[0]['Low']; var high1stvalue = $scope.sortBy(rowdata ,{prop : "high"})[0]['high']; $scope.mycol = [ {field: 'High', displayName: 'High', width:"*" }, {field: 'Low', displayName: 'Low', width:"*" }, {field: 'Date', displayName: 'Date', width:"*" }, {field: 'count', displayName: 'count', width:"*" } ] var counter =0; var monthyear = null; counter =1; var groupbydata = []; for(var k=0; k<details.length-1; k++) { groupbydata.push( { "High": details[k]['High'], "Low": details[k]['Low'], "Date": details[k]['Date'].split('-')[1] + "-" +details[k]['Date'].split('-')[0], "count": counter } ) } var obj = $scope.groupby(groupbydata,"Date"); for(var k=0; k<obj.length-1; k++) { var min = $scope.sortBy(obj[k] , {prop: "Low"})[0]['Low']; var max = $scope.sortBy(obj[k] , {prop: "Low"})[obj[k].length-1]['High']; var lowerobj = $scope.sortBy(obj[k] , {prop: "Low"}); for(var m=0; m<lowerobj.length-1; m++) { if(lowerobj[m]['Low'] >= min && lowerobj[m]['Low'] < Number(min)+ Number(1)) counter = counter +1; else { detailsgrid.push( { "High": Number(min)+ Number(1), "Low": min, "Date": lowerobj[m]['Date'], "count": counter } ); counter =0; min = Number(min)+ Number(1); } } } $scope.gridOptionsprice.columnDefs = $scope.mycol; $scope.gridOptionsprice.data = detailsgrid; } $scope.sortBy = function() { //cached privated objects var _toString = Object.prototype.toString, //the default parser function _parser = function (x) { return x; }, //gets the item to be sorted _getItem = function (x) { return this.parser((_toString.call(x) === "[object Object]" && x[this.prop]) || x); }; // Creates a method for sorting the Array // @array: the Array of elements // @o.prop: property name (if it is an Array of objects) // @o.desc: determines whether the sort is descending // @o.parser: function to parse the items to expected type return function (array, o) { if (!(array instanceof Array) || !array.length) return []; if (_toString.call(o) !== "[object Object]") o = {}; if (typeof o.parser !== "function") o.parser = _parser; //if @o.desc is false: set 1, else -1 o.desc = [1, -1][+!!o.desc]; return array.sort(function (a, b) { a = _getItem.call(o, a); b = _getItem.call(o, b); return ((a > b) - (b > a)) * o.desc; }); }; } $scope.groupby = function(collection, property) { var i= 0, index, values =[],result =[]; for(; i< collection.length; i++) { var val; val =collection[i][property]; index = values.indexOf(val); if(index >-1) result[index].push(collection[i]); else { values.push(val); result.push([collection[i]]); } } return result; } }). controller('MyCtrl2', function ($scope) { // write Ctrl here }); app.factory('service', function($q, $http) { var fixedEncodeURIComponent = function(str) { return encodeURIComponent(str).replace(/[!'()]/g, escape).replace(/\*/g, "%2A").replace(/\"/g, "%22"); }; var format = '&format=json&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback=JSON_CALLBACK'; return { // return a promise to controller getHistoricalDataWithQ: function(symbol, start, end) { var deferred = $q.defer(); var query = 'select * from yahoo.finance.historicaldata where symbol = "' + symbol + '" and startDate = "' + start + '" and endDate = "' + end + '"'; var url = 'http://query.yahooapis.com/v1/public/yql?q=' + fixedEncodeURIComponent(query) + format; console.log(url); $http.jsonp(url).success(function(json) { console.log(JSON.stringify(json)); var quotes = json.query.results.quote; // filter + format quotes here if you want deferred.resolve(quotes); }).error(function(error) { console.log(JSON.stringify(error)); }); return deferred.promise; }, // add a callback from controller getHistoricalDataWithCallback: function(callback, symbol, start, end) { var query = 'select * from yahoo.finance.historicaldata where symbol = "' + symbol + '" and startDate = "' + start + '" and endDate = "' + end + '"'; var url = 'http://query.yahooapis.com/v1/public/yql?q=' + fixedEncodeURIComponent(query) + format; console.log(url); $http.jsonp(url).success(function(json) { console.log(JSON.stringify(json)); var quotes = json.query.results.quote; // filter + format quotes here if you want callback(quotes); }).error(function(error) { console.log(JSON.stringify(error)); }); }, // let angular watch the scope change implicitly getHistoricalDataWithWatch: function(symbol, start, end) { var query = 'select * from yahoo.finance.historicaldata where symbol = "' + symbol + '" and startDate = "' + start + '" and endDate = "' + end + '"'; var url = 'http://query.yahooapis.com/v1/public/yql?q=' + fixedEncodeURIComponent(query) + format; console.log(url); var quotes = {}; $http.jsonp(url).success(function(json) { console.log(JSON.stringify(json)); quotes.list = json.query.results.quote; }).error(function(error) { console.log(JSON.stringify(error)); }); return quotes; } }; }); app.jsvar app = angular.module('myApp', [ 'ngTouch', 'ui.grid', 'myApp.controllers', 'myApp.filters', 'myApp.services', 'myApp.directives' ]). config(function ($routeProvider, $locationProvider) { $routeProvider. when('/view1', { templateUrl: 'partials/partial1', controller: 'MyCtrl1' }). when('/view2', { templateUrl: 'partials/partial2', controller: 'MyCtrl2' }). when('/view3', { templateUrl: 'partials/partial3', controller: 'MyCtrl3' }). otherwise({ redirectTo: '/view1' }); $locationProvider.html5Mode(true); });
No comments:
Post a Comment