app.js
angular.module('app', ['ionic', 'ui.router'])
.config(('$urlRouterProvider', '$stateProvider', function($urlRouterProvider,$stateProvider){
$urlRouterProvider.otherwise('/');
$stateProvider
.state('view',{
url:'/',
templateUrl:'js/components/view/view32.html',
controller:'viewCtrl'
})
}))
server.js
var express= require('express');
var mongoose = require('mongoose');
var bodyParser=require('body-parser');
var cors= require('cors');
var app= express();
var multiparty= require('connect-multiparty');
var multipartMiddleware= multiparty();
var viewController=require('./controllers/viewController');
var shareController=require('./controllers/shareController');
var configs = require('./configs/config.js');
configs.setConfigs();
mongoose.connect(process.env.MONGO_URL);
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
extended: true
}));
app.use(multipartMiddleware);
app.use(cors());
app.use('/app', express.static(__dirname+ '/app'));
app.get('/',function(req,res){
res.sendFile(__dirname +'/index.html');
});
app.post('/share', multipartMiddleware, shareController.shareNewPicture);
app.get('/getNewPhoto', viewController.getNewPhoto);
/*app.use(function(req, res, next) {
res.setHeader("Access-Control-Allow-Origin", "*");
res.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
res.header('Access-Control-Allow-Methods','POST, GET, OPTIONS, PUT');
next();
});*/
var port = 8080 || process.env.PORT;
app.listen(port, function(){
console.log('Server Started '+ port);
});
view.js
(function(window, angular, undefined)
{
angular.module('app')
.controller('viewCtrl',['$scope','$state','$http',function($scope,$state,$http)
{
$scope.pics=[];
$http.get('http://localhost:8080/getNewPhoto').then(function(response){
$scope.pics=response.data;
console.log('Hello photos are here');
},function(err)
{
console.error("There's an error"+err);
})
}])
})(window,window.angular)
The index.html where I'm calling views index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<link rel="manifest" href="manifest.json">
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.4.2/angular-ui-router.min.js"></script>
<script src="cordova.js"></script>
<script src="js/app.js"></script>
<script src="js/components/view/view.js"></script>
</head>
<body ng-app="app">
<ion-pane>
<ion-header-bar class="bar-stable">
<h1 class="title"></h1>
</ion-header-bar>
<ion-content>
<div ui-view>
</div>
</ion-content>
</ion-pane>
</body>
</html>
Here's the view.html which i want to show view1.html
<div>
<div ng-repeat='pics in pic'>
<p> This is the view.html</p>
<img ng-src={{pic.url}}/>
</div>
</div>
There's nothing happening with view. I'm trying to get the view of photos but its not showing any error or any view. Please if anybody could help!!