使用angular js从codeigniter控制器获取数据

时间:2016-09-01 05:47:43

标签: angularjs json codeigniter codeigniter-2

我使用带有角度js的codeigniter。 我创建了一个控制器名称Car.one模型名称car_model。 在汽车控制器中,我创建了一个方法视图(),其中我从表中获取代码文件

的数据

汽车控制器

    <?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

    class Car extends CI_Controller {

     public function __construct() {

        parent::__construct();
        $this->load->model('Car_model');
     }

     public function view()
     {
        $data = $this->db->get("cars")->result_array();
        echo json_encode($data);
     }
    }

我想在json formate中获取数据,因此获取了该数据并回显了json_encode($ data);

现在我想在angualrjs中检索那些数据。

add_car查看

<!DOCTYPE html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<html>
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">

    </head>
    <body ng-app="myapp" ng-controller="myctrl">
        <form method="post"  ng-submit="add(car_det)">
            Car name : <input type="text" ng-model="car_det.cname" name="name"><br>
            Car Image : <input type="file" custom-on-change="uploadFile" ng-model="car_det.cimage"><br>
            <input type="submit" name="add">
        </form>
        <br>
        <table>
            <tr><td>ID </td><td>Car Name</td><td>Car Image</td></tr>
            <tr ng-repeat="x in otherdata">
                <td>{{x.id}}</td><td>{{x.cname}}</td><td>{{x.cimage}}</td>
            </tr>
        </table>
    </body>
</html>


<script type="text/javascript">
var app = angular.module("myapp",[]);
app.controller("myctrl",function($scope,$http){
$http.get("<?=base_url()?>Car/view").then(function(response){
                $scope.otherdata = response.data;
            });
});
</script>

**

错误:

当我在我的文件中编写此代码时,问题是它以表格格式显示数据是正确的,但在页面开头显示额外的json数组。

我收到了这个输出:

**

enter image description here

我还没有写任何代码显示在页面的开头仍然显示...

如何解决这个问题..?

2 个答案:

答案 0 :(得分:0)

将控制器功能更改为:

public function view()
{
   $data = $this->db->get("cars")->result_array();
   header('Content-Type: application/json');
   echo json_encode($data);
}

你从控制器发送json。但是如果你没有指定它,它会作为默认类型发送,这将是我相信的html,这就是它打印在你的页面上的原因。

如果使用的话会更好:

$this->output->set_content_type('application/json');
$this->output->set_output(json_encode($data));

使用output是处理codeigniter控制器中输出数据的正确方法。

答案 1 :(得分:0)

If your view page is a html page then you have to define a global variable baseUrl where you need to write static base_url() value like this

var baseUrl = 'http://localhost/yourProjectName/';

If this your page is php page then defiine a hidden input tag and this value is base_url(); and inside script write

var baseUrl = $('#inputId').val();

then your script like this..

app.controller("myctrl",function($scope,$http){
    $http.get(baseUrl+'Car/view').then(function(response){
       $scope.otherdata = response.data;
    });         
});