AngularJS — не удается получить данные из внешнего файла

#javascript #php #angularjs #json #angular-ui-bootstrap

#javascript #php #angularjs #json #angular-ui-bootstrap

Вопрос:

Невозможно получить данные из файла PHP, а также из файла JSON

timesheet.php

 require 'dbconnect.php';

$array_data = array();
$query = "SELECT * FROM timesheet";

$stmt = $conn->prepare($query);
$stmt->execute($array_data);
$result_data = $stmt->fetchAll( PDO::FETCH_ASSOC );

if( !empty($result_data) ) {    

    header('Content-type: application/json');
    $json = json_encode($result_data);
    // echo $json;
    echo preg_replace("/null/", '""', $json); // replace null to ""

}
  

timesheet.json

 [
    {
        "id": 1,
        "date": "20th August 2016",
        "day": "Sat",
        "in1": "10:30",
        "out1": "02:30",
        "in2": "04:00",
        "out2": "08:00",
        "in3": "",
        "out3": "",
        "total_hours": "8:00",
        "status": "1"
    },
    {   
        "id": 2,
        "date": "20th August 2016",
        "day": "Sat",
        "in1": "10:30",
        "out1": "02:30",
        "in2": "04:00",
        "out2": "08:00",
        "in3": "",
        "out3": "",
        "total_hours": "8:00",
        "status": "1"
    }
    ...
]
  

controller.js

 .controller('tableCtrl', function($filter, $sce, ngTableParams, tableService) {

        var data = tableService.data
    //Editable
        this.tableEdit = new ngTableParams({
            page: 1,            // show first page
            count: 10           // count per page
        }, {
            total:data.length, // length of data
            getData: function($defer, params) {
                $defer.resolve(data.slice((params.page() - 1) * params.count(), params.page() * params.count()));
            }
        });
    })
  

script.js

 .service('tableService', ['$http', function($http){

        this.data = $http.get("data/timesheet.php")
        //this.data = $http.get("data/timesheet.json")

    }])
  

HTML

 <table ng-table="tctrl.tableEdit" class="table table-striped table-vmiddle">
       <tr ng-repeat="w in $data"  ng-class="{ 'active': w.$edit }">
          <td data-title="'ID'">
             <span ng-if="!w.$edit">{{ w.id }}</span>
             <div ng-if="w.$edit"><input class="form-control" type="text" ng-model="w.id" /></div>
          </td>
          ...
       </tr>                        
   </table>
  

Когда я помещаю данные json в service.js вот так.data = [{..}] это работает, но теперь мне нужно получить данные из внешнего файла, который может быть либо файлом JSON, либо файлом PHP, но он не работает, так как я получаю пустую таблицу. Кто-нибудь может мне помочь? Я очень новичок в AngularJS

Комментарии:

1. Я думаю, вы пытаетесь получить доступ к файлам, которые еще не существуют. Поэтому вы должны использовать обещание или обратный вызов для этого файла php, потому что данные готовы только после завершения обработки php. Он работает с JSON, потому что данные там статичны, готовы в любое время, но php необходимо вычислить данные из БД и создать ответ json (такой же, как содержимое json), но это требует времени.

2. Http-запрос не возвращается мгновенно. Это асинхронный вызов, и он должен обрабатываться иначе, чем то, что вы делаете. ( docs.angularjs.org/api/ng/service /$http )

3. @DincaAdrian Он не работает с расписанием. также json. Он работает только тогда, когда я записываю данные json непосредственно в service.js . Пожалуйста, не могли бы вы предоставить какой-нибудь пример кода, как я могу использовать обещание или обратный вызов здесь?

4. @VladimirM Хорошо! но не могли бы вы сказать мне, пожалуйста, как я могу с этим справиться? Я совершенно не понимаю этого.

5. @User7 Вы перешли по ссылке, которую я прикрепил к комментарию? Есть пример запроса angular get. Он возвращает обещание. Вам действительно нужно прочитать документацию об этом, если вы планируете использовать angular для своего проекта.

Ответ №1:

Попробуйте заставить это работать с функцией успеха и ошибки в качестве обратных вызовов:

http://www.w3schools.com/angular/angular_http.asp

В нижней части этой страницы есть пример ответа JSON. Прежде всего, если вы выполняете запрос в браузере для этого php-файла, можете ли вы указать его здесь в вопросе (чтобы увидеть результат)