Angular:ng-repeatが正しく機能していませんが、オブジェクトはコンソールに表示されます

ダスティン・リー

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>

これは私のクライアントコントローラーです。何らかの理由で、この部分のコンソールはコンソールに新しい詩を記録しますが、私の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);
  }
  })
}

};

ありがとうございました!

サトパル

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

_this.newpoem=data;

の代わりに

this.newpoem=data;

さらに、ngRepeatディレクティブで正しい変数を使用します

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

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

ng-repeatローカルオブジェクトをディレクティブコントローラに渡すことが機能していません

分類Dev

Angularはテーブル行にデータを表示していません。ng-repeatが機能していません

分類Dev

Angularコントローラーがサービスオブジェクトプロパティng-repeatをバインドしていません

分類Dev

Angular 7:ngサーブは機能しますが、コンソールにZone.jsエラーが表示され、アプリが読み込まれません

分類Dev

ng-options が選択され、オブジェクトがモデルとして機能しない [Angular 1.5]

分類Dev

Angular 2配列はコンソールに印刷されますが、オブジェクトプロパティを画面に印刷できません

分類Dev

Angular UI-ルーターはHTMLコンテンツを表示していませんが、正しいパスに誘導しています。エラーはありませんが、UIビューが機能しません

分類Dev

チェックボックスがng-repeat、AngularJsで正しく機能していません

分類Dev

ng-srcは正しく機能していませんが、srcは正常に機能しています

分類Dev

Angular $ scopeが期待どおりに機能していません。コントローラの$ scopeおよび$ scope.functionスコープでオブジェクト値を割り当てようとしています

分類Dev

リストオブジェクトはng-repeatを使用して表示されません

分類Dev

Angular js:Android Studioコンソールに予期しないトークンエラーが表示されますが、ブラウザーでは正常に機能します

分類Dev

Angular 1.x:data-ng-repeat内のオブジェクトの属性は、オブジェクトではなく文字列として設定されます

分類Dev

クラスはAngular機能を使用していますが、装飾されていません。明示的なAngularデコレータを追加してください

分類Dev

Firebase / Angular:メッセージはHTMLで表示されませんが、メッセージオブジェクトが含まれています

分類Dev

Angular JS ng-ng-repeatが機能せずに選択されました

分類Dev

ng-viewはページを表示していませんが、コントローラーは機能しています

分類Dev

AngularJS-ng-repeat内でng-showを正しく使用する方法は?ブール値が更新されていません

分類Dev

Angular4プロジェクトにng-bootstrapCSSをインストールしましたが、機能していないようです

分類Dev

Angular 6のあるコンポーネントから別のコンポーネントにルートをナビゲートするときに、サブジェクトが機能していません

分類Dev

オブジェクトが空であるかどうかを確認します。ng-showでは機能しますが、コントローラーからは機能しませんか?

分類Dev

npmリンクがangular-cliで作成されたプロジェクトで機能していません

分類Dev

JSONオブジェクトでng-repeatを使用しても機能しません-なぜですか?

分類Dev

Angular FIrebase5オブジェクトのキーが表示されていません。削除できません

分類Dev

Angular2はこのエラーを示しています:TypeError:オブジェクトにはメソッド 'requestAnimationFrame'がありません

分類Dev

angle.element(document.getElementById( 'id'))。html();によってangularを使用してhtml要素のコンテンツを取得できますか?コンソールに未定義のオブジェクトが表示されるため

分類Dev

ng-repeat:オブジェクトのグループ化された値に基づいてテーブルをレンダリングします

分類Dev

「@angular / compiler-cli」パッケージが正しくインストールされていません

分類Dev

Angular2:モジュールが正しくインポートされていません

Related 関連記事

  1. 1

    ng-repeatローカルオブジェクトをディレクティブコントローラに渡すことが機能していません

  2. 2

    Angularはテーブル行にデータを表示していません。ng-repeatが機能していません

  3. 3

    Angularコントローラーがサービスオブジェクトプロパティng-repeatをバインドしていません

  4. 4

    Angular 7:ngサーブは機能しますが、コンソールにZone.jsエラーが表示され、アプリが読み込まれません

  5. 5

    ng-options が選択され、オブジェクトがモデルとして機能しない [Angular 1.5]

  6. 6

    Angular 2配列はコンソールに印刷されますが、オブジェクトプロパティを画面に印刷できません

  7. 7

    Angular UI-ルーターはHTMLコンテンツを表示していませんが、正しいパスに誘導しています。エラーはありませんが、UIビューが機能しません

  8. 8

    チェックボックスがng-repeat、AngularJsで正しく機能していません

  9. 9

    ng-srcは正しく機能していませんが、srcは正常に機能しています

  10. 10

    Angular $ scopeが期待どおりに機能していません。コントローラの$ scopeおよび$ scope.functionスコープでオブジェクト値を割り当てようとしています

  11. 11

    リストオブジェクトはng-repeatを使用して表示されません

  12. 12

    Angular js:Android Studioコンソールに予期しないトークンエラーが表示されますが、ブラウザーでは正常に機能します

  13. 13

    Angular 1.x:data-ng-repeat内のオブジェクトの属性は、オブジェクトではなく文字列として設定されます

  14. 14

    クラスはAngular機能を使用していますが、装飾されていません。明示的なAngularデコレータを追加してください

  15. 15

    Firebase / Angular:メッセージはHTMLで表示されませんが、メッセージオブジェクトが含まれています

  16. 16

    Angular JS ng-ng-repeatが機能せずに選択されました

  17. 17

    ng-viewはページを表示していませんが、コントローラーは機能しています

  18. 18

    AngularJS-ng-repeat内でng-showを正しく使用する方法は?ブール値が更新されていません

  19. 19

    Angular4プロジェクトにng-bootstrapCSSをインストールしましたが、機能していないようです

  20. 20

    Angular 6のあるコンポーネントから別のコンポーネントにルートをナビゲートするときに、サブジェクトが機能していません

  21. 21

    オブジェクトが空であるかどうかを確認します。ng-showでは機能しますが、コントローラーからは機能しませんか?

  22. 22

    npmリンクがangular-cliで作成されたプロジェクトで機能していません

  23. 23

    JSONオブジェクトでng-repeatを使用しても機能しません-なぜですか?

  24. 24

    Angular FIrebase5オブジェクトのキーが表示されていません。削除できません

  25. 25

    Angular2はこのエラーを示しています:TypeError:オブジェクトにはメソッド 'requestAnimationFrame'がありません

  26. 26

    angle.element(document.getElementById( 'id'))。html();によってangularを使用してhtml要素のコンテンツを取得できますか?コンソールに未定義のオブジェクトが表示されるため

  27. 27

    ng-repeat:オブジェクトのグループ化された値に基づいてテーブルをレンダリングします

  28. 28

    「@angular / compiler-cli」パッケージが正しくインストールされていません

  29. 29

    Angular2:モジュールが正しくインポートされていません

ホットタグ

アーカイブ