Nothing is being shown while there's no error.

2019-07-26 16:59发布

问题:

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!!

回答1:

In ajax you write :

$scope.pics=response.data;

but in your ng-repeat your write:

<div ng-repeat='pics in pic'>

change to

<div ng-repeat='pic in pics'>