Angular:ng-repeat工作不正常,但对象在控制台中显示

时间:2017-01-04 06:23:42

标签: javascript angularjs node.js mongodb express

为什么我的ng-repeat没有显示我的内容感到困惑。下面是我的app.js,客户端控制器,工厂和服务器控制器的代码。 基本上一切都表明。我写的所有控制台日志确实在控制台上显示在chrome和我的终端中,但由于某种原因,ng-repeat只是不起作用。 对不起,很抱歉。

App routes *************************************
var myApp = angular.module('myApp', ['ngRoute']);

myApp.config(function ($httpProvider, $routeProvider) {
$httpProvider.interceptors.push(
  function($q, $location) {
  return {
      'responseError':function(rejection){
      if (rejection.status == 401){
          $location.url('/');
      }
      return $q.reject(rejection);
  }
};
});
  $routeProvider
.when('/list',{
  templateUrl: 'assets/partials/list.html',
  controller: 'poemController',
  controllerAs: "meep"
})
 .otherwise({
   redirectTo: '/'
 });
});

这是HTML。不确定是不是因为“控制器”使其变得困难,或者我的语法错误...

<h3>Top Shared Poems</h3>
  <center><table>
  <thead>
   <th>
     Title
   </th>
   <th>
     Shared
   </th>
  </thead>
   <tbody>
    <tr ng-repeat='tops in meep.newpoem'>
      <td>{{meep.tops.title}}</td>
      <td>{{meep.tops.shared}}</td>
    </tr>
   </tbody>
  </table></center>

这是我的客户端控制器,由于某种原因,这部分控制台在控制台上记录了newpoem,但我的ng-repeat仍然不起作用。

myApp.controller('poemController', ['poemFactory', '$location', '$routeParams', poemController]);

function poemController(poemFactory, $location, $routeParams){
  var _this = this;
  var shownewpoem = function(){
  console.log('in shownewpoem')
  poemFactory.shownew(function(data){
    console.log('in the shownew controller function')
    this.newpoem=data;
    console.log(this.newpoem)
    console.log('getting the newpoems')
  })
}
shownewpoem();

这是我的工厂方

myApp.factory('poemFactory', ['$http', function($http){
var factory = {}

factory.shownew = function(callback){
  $http.get('/shownewpoem').then(function(returned_data){
    console.log(returned_data.data);
    console.log('in the shownew factory')
    callback(returned_data.data);
  })
}
return factory;
}]);

这是我的服务器端控制器

var mongoose = require('mongoose');
var newPoem = mongoose.model('savedPoem')

this.shownew = function(req,res) {
  newPoem.find({}, function(err,newpoems) {
    console.log('in the server shownew')
    if(err) {
      console.log('did not get newpoem')
    } else {
      console.log('it is going back to factory shownew')
      console.log(newpoems)
      res.json(newpoems);
  }
  })
}

};

谢谢!

1 个答案:

答案 0 :(得分:0)

您需要使用引用控制器实例的_this

_this.newpoem=data;

而不是

this.newpoem=data;

另外,在ngRepeat指令

中使用正确的变量
<tr ng-repeat='tops in meep.newpoem'>
      <td>{{tops.title}}</td>
      <td>{{tops.shared}}</td>
 </tr>