angularjs ng-repeat не показывает данные

#angularjs #ng-repeat

#angularjs #angularjs-ng-repeat

Вопрос:

У меня эта проблема на моей веб-странице:

  app.controller('MessageController',['$http',function($http){
        http.get("DataManage.php?metodo=GetMessage")
        .then(function(response){
        this.Message=response.data.records;
        });


         this.ShowMyMessage=function(){
            console.log("Message");
            }   
    }])

Json поступает правильно, но если я хочу отобразить эти значения внутри div с помощью ng-repeat, ничего не отображается:

    <div class="card-content Blue-text" ng-controller='MessageController'>
            <li id="MessageBox" ng-repeat='msg in Message'>
                    <span>{{msg.Text}}</span></li>
             </li>
       </div>

Я много раз проверял реализацию, но не могу найти причину, по которой это происходит.

1. Сообщение не должно быть написано с заглавной буквы по соглашению, и вокруг вашего ‘ =’ должны быть пробелы. * если только это не указано в определении функции для параметров как (code='good', starter={}) => { body of function } . Но реальная проблема, с которой вы сталкиваетесь, заключается в том, что вам нужно $scope.messages (обратите внимание на его множественное число, потому что это массив), а не это. Сообщение (это относится к контроллеру, а не к области, используемой в представлении html).

Ответ №1:

Похоже, вы пытались использовать controllerAs шаблон. В этом случае вам нужно связать все переменные внутри контекста функции контроллера ( this ), что вы уже сделали. Но вы пропустили определение псевдонима контроллера внутри ng-controller директивы value , например ng-controller="MessageController as vm" .

Разметка

 <div class="card-content Blue-text" ng-controller="MessageController as vm">
    <li id="MessageBox" ng-repeat='msg in vm.Message'>
        <span>{{msg.Text}}</span></li>
    </li>
</div>

Контроллер

 app.controller('MessageController', ['$http', function($http) {
  var vm = this; //put this inside vm to avoid this related issue.
  $http.get("DataManage.php?metodo=GetMessage")
    .then(function(response) {
       vm.Message = response.data.records;
    }
  );

  vm.ShowMyMessage = function() {
    console.log("Message");
  }
}]);

Ответ №2:

Измените this.message на $scope.message

 app.controller('MessageController',['$http',function($http,$scope){
$http.get("DataManage.php?metodo=GetMessage")
.then(function(response){
 $scope.Message=response.data.records;
});

Ответ №3:

Используйте переменную scope.

 app.controller('MessageController',['$http','$scope',function($http,$scope){

    $http.get("DataManage.php?metodo=GetMessage")
.then(function(response){

 $scope.Message=response.data.records;


});



this.ShowMyMessage=function(){

        console.log("Message");

}
}]);