title: using angular js get data from codeigniter controller
body: <p>I work with codeigniter with angular js.
  I had created one controller name Car.one model name car_model.
  In car controller i have created one method view () in which i am fetching data from the table that code file is </p>
  
  <p><strong>Car Controller</strong></p>
  
  <pre><code>    &lt;?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
  
      class Car extends CI_Controller {
  
       public function __construct() {
  
          parent::__construct();
          $this-&gt;load-&gt;model('Car_model');
       }
  
       public function view()
       {
          $data = $this-&gt;db-&gt;get("cars")-&gt;result_array();
          echo json_encode($data);
       }
      }
  </code></pre>
  
  <p>i want to fetch data in json formate so had fetched that data and  echo json_encode($data); </p>
  
  <p>now i want to retrieve that data in angualrjs.</p>
  
  <p><strong>add_car View</strong></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"&gt;&lt;/script&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;title&gt;TODO supply a title&lt;/title&gt;
          &lt;meta charset="UTF-8"&gt;
          &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
  
      &lt;/head&gt;
      &lt;body ng-app="myapp" ng-controller="myctrl"&gt;
          &lt;form method="post"  ng-submit="add(car_det)"&gt;
              Car name : &lt;input type="text" ng-model="car_det.cname" name="name"&gt;&lt;br&gt;
              Car Image : &lt;input type="file" custom-on-change="uploadFile" ng-model="car_det.cimage"&gt;&lt;br&gt;
              &lt;input type="submit" name="add"&gt;
          &lt;/form&gt;
          &lt;br&gt;
          &lt;table&gt;
              &lt;tr&gt;&lt;td&gt;ID &lt;/td&gt;&lt;td&gt;Car Name&lt;/td&gt;&lt;td&gt;Car Image&lt;/td&gt;&lt;/tr&gt;
              &lt;tr ng-repeat="x in otherdata"&gt;
                  &lt;td&gt;{{x.id}}&lt;/td&gt;&lt;td&gt;{{x.cname}}&lt;/td&gt;&lt;td&gt;{{x.cimage}}&lt;/td&gt;
              &lt;/tr&gt;
          &lt;/table&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  
  
  &lt;script type="text/javascript"&gt;
  var app = angular.module("myapp",[]);
  app.controller("myctrl",function($scope,$http){
  $http.get("&lt;?=base_url()?&gt;Car/view").then(function(response){
                  $scope.otherdata = response.data;
              });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>**</p>
  
  <p><strong>Error :</strong></p>
  
  <p><strong>While i writing this code in my file, problem is that it shows data in table format it is proper but also showing extra json array in starting of page.</strong></p>
  
  <p><strong>I am getting this output :</strong></p>
  
  <p>** </p>
  
  <p><a href="https://i.stack.imgur.com/djkdu.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/djkdu.jpg" alt="enter image description here"></a></p>
  
  <p>i had not written any code to display in starting of page still showing that ...    </p>
  
  <p>how to resolve that problem .. ?</p>