AngularJS / PHP - ng-repeat с получением массива из php ничего не показывает - PullRequest
0 голосов
/ 26 сентября 2018

У меня проблемы с использованием ng-repeat.

Сначала я получаю объект JSON из базы данных ( read.php ).И преобразовать его в объект массива javascript

var as = JSON.parse(data);
$scope.datadata = as;

Я могу получить ответ $scope.datadata в консоли, но ничего не получить в браузере.Поэтому я использовал тестовый массив $scope.Picture_set, и он правильно отображался в браузере.Что я могу сделать с моим кодом, чтобы показать элементы базы данных через ng-repeat?

pic

read.php

<?php

require 'lib.php';
$object = new CRUD();
$picturetb = $object->Read();

if (count($picturetb) > 0) {
    $arr = [];
    foreach ($picturetb as $key=>$picture) {
        $arr[] = array('key' => $key, 'name' => $picture['Picture_Name']);
    }     
}
echo json_encode($arr); 

?>

html

<body>
  <div ng-app="mainApp" ng-controller="drawbackController" class="container-fluid">    
      <div class="sidenav">                
          <table>
              <thead>
                  <tr>
                      <th>No. </th>
                      <th>PictureName</th>
                  </tr>
              </thead>
              <tbody>
                  <!-- fail -->
                  <tr ng-repeat="d in datadata">

                  <!-- success -->
                  <!-- <tr ng-repeat="d in Picture_set"> -->
                      <td> {{ d.key }} </td>
                      <td><a> {{ d.name }} </a></td>
                  </tr>
              </tbody>
          </table>

          <br>
          <div class="addPicture" id="addPicture"></div>
      </div>


    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
    <script src="JS.js"></script>
  </div>
</body>

JS.js

var mainApp = angular.module("mainApp", []);
mainApp.controller('drawbackController', function ($scope) {

    $scope.datadata =[];

    // READ records
    $scope.readRecords = function () {
        $.get("ajax/read.php", {}, function (data, status) {

            console.log(data);
            var as = JSON.parse(data);
            $scope.datadata = as;

            console.log($scope.Picture_set);
            console.log($scope.datadata);

            $(".addPicture").html($scope.datadata);
        });
    }
    $scope.readRecords();

    // a test array
    $scope.Picture_set = [
        { 'name': 'picture1' },
        { 'name': 'picture2' },
        { 'name': 'picture3' },
        { 'name': 'picture4' },
        { 'name': 'picture5' }
    ];

});

1 Ответ

0 голосов
/ 26 сентября 2018

Вы используете jQuery $.get вместо AngularJS $http.get.Как следствие, ваш $scope не знает об изменениях в обратном вызове $.get.Вы можете ..

  • использовать $http.get и $scope автоматически обнаружит изменения
  • в вашем текущем коде, обернуть изменения в функции $scope.apply()

Вы можете прочитать о $scope.apply

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...