2017-01-04 6 views
0

なぜ私のコンテンツが表示されないのですか?以下は、私のapp.js、クライアントコントローラ、ファクトリ、およびサーバコントローラのコードです。 基本的にすべてが表示されます。私が書いたすべてのコンソールログは、コンソールのchromeと私の端末に表示されますが、何らかの理由でng-repeatが機能しません。 長い質問のために申し訳ありません。角度: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); 
    } 
    }) 
} 

}; 

ありがとうです!

+0

に正しい変数を使用するアンチパターンです...' $ http'を使用約束 – charlietfl

答えて

0

コントローラのインスタンスを参照する_thisを使用する必要があります。

_this.newpoem=data; 

代わりの

this.newpoem=data; 

Additinallyは、 `$ http`にコールバックを使用してngRepeatディレクティブ

<tr ng-repeat='tops in meep.newpoem'> 
     <td>{{tops.title}}</td> 
     <td>{{tops.shared}}</td> 
</tr> 
+0

作品!ありがとう!これの代わりに_thisを使うことが知られていたはずです。再度、感謝します! –