silverbux / laravel-angular-admin

Laravel + Angularjs + Bootstrap + AdminLTE binded by Gulp workflow Admin Dashboard Boilerplate / Starter.
http://silverbux.github.io/laravel-angular-admin/
MIT License
925 stars 414 forks source link

Cannot set property 'error' of undefined #102

Closed ArturKami closed 7 years ago

ArturKami commented 7 years ago

Hi First of all great job with this project it's fantastic ! but i got litle problem, i hope u can help me out :)

im using

first i created new route in laravel routes.php

$api->group(['middleware' => ['api', 'api.auth', 'role:admin.super|admin.user']], function ($api) {
    $api->controller('users', 'UserController');
    $api->controller('userss', 'UserController');
});

then i edited user-lists.component.js and try to log it in chrome

class UserListsController {
  constructor ($scope, $state, $compile, DTOptionsBuilder, DTColumnBuilder, API, $log) {
    'ngInject
    this.API = API
    this.$state = $state
    let Users = this.API.service('users')
    Users.getList()
      .then((response) => {
        let dataSet = response.plain()

        this.dtOptions = DTOptionsBuilder.newOptions()
          .withOption('data', dataSet)
          .withOption('createdRow', createdRow)
          .withOption('responsive', true)
          .withBootstrap()
        this.dtColumns = [
          DTColumnBuilder.newColumn('id').withTitle('ID'),
          DTColumnBuilder.newColumn('name').withTitle('Name'),
          DTColumnBuilder.newColumn('email').withTitle('Email'),
          DTColumnBuilder.newColumn(null).withTitle('Actions').notSortable()
            .renderWith(actionsHtml)
        ]
        this.displayTable = true
      })
      /////////////////////////////////////////////////////////// test ///////////////////////////////////////////////////////////////
      let us = this.API.service('userss') 
      us.getList()
        .then((response) => {
          let dataSet = response.plain()
          $log.log(dataSet); 
        }) 
      ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    let createdRow = (row) => {
      $compile(angular.element(row).contents())($scope)
    }
    let actionsHtml = (data) => {
      return 
               " <a class="btn btn-xs btn-warning" ui-sref="app.useredit({userId: ${data.id}})">
                    <i class="fa fa-edit"></i>
                </a>
                &nbsp
                <button class="btn btn-xs btn-danger" ng-click="vm.delete(${data.id})">
                    <i class="fa fa-trash-o"></i>
                </button>"
    }
  }
  delete (userId) {
    let API = this.API
    let $state = this.$state
    swal({
      title: 'Are you sure?',
      text: 'You will not be able to recover this data!',
      type: 'warning',
      showCancelButton: true,
      confirmButtonColor: '#DD6B55',
      confirmButtonText: 'Yes, delete it!',
      closeOnConfirm: false,
      showLoaderOnConfirm: true,
      html: false
    }, function () {
      API.one('users').one('user', userId).remove()
        .then(() => {
          swal({
            title: 'Deleted!',
            text: 'User Permission has been deleted.',
            type: 'success',
            confirmButtonText: 'OK',
            closeOnConfirm: true
          }, function () {
            $state.reload()
          })
        })
    })
  }
  $onInit () {}
}
export const UserListsComponent = {
  templateUrl: './views/app/components/user-lists/user-lists.component.html',
  controller: UserListsController,
  controllerAs: 'vm',
  bindings: {}
}

but it returns error in chrome

final-69e9771b85.js:24015 TypeError: Cannot set property 'error' of undefined
    at final-69e9771b85.js:107291
    at final-69e9771b85.js:92840
    at arrayEach (final-69e9771b85.js:47754)
    at Function.forEach (final-69e9771b85.js:56576)
    at Object.config.responseExtractor (final-69e9771b85.js:92839)
    at parseResponse (final-69e9771b85.js:93583)
    at okCallback (final-69e9771b85.js:93614)
    at processQueue (final-69e9771b85.js:26512)
    at final-69e9771b85.js:26528
    at Scope.$eval (final-69e9771b85.js:27810)

and the final-69e9771b85.js:24015 is

 if (hasApply) {
        return function() {
          var args = [];
          forEach(arguments, function(arg) {
            args.push(formatError(arg));
          });
          return logFn.apply(console, args); <---------------------------- here 
        };
    }

inPostman when i copy userss route to not guarded api group, route http://localhost:8010/api/userss returning same data as http://localhost:8010/api/users

Please help me !

ArturKami commented 7 years ago

ok i log ApiService.js the addResponseInterceptor part

.addResponseInterceptor(function (response, operation, what) {
          if (operation === 'getList') {
            var newResponse = response.data[what]
            $log.log("new response : "+newResponse)
            $log.log("response",response)
            //newResponse.error = response.error
            return newResponse
          }

          return response
        })

and this is what i return in your user-list component using users laravel conttoller

image

and this is result from my component using the same users laravel controller but difrent route name image

ArturKami commented 7 years ago

I got it ! this is my laravel controller returning

   public function getIndex()
    {
        $users = User::all();

        return response()->success(compact('users'));
    }

i changed it to

public function getIndex()
    {
        $sprawdzaniepingsystemow = User::all();

        return response()->success(compact('sprawdzaniepingsystemow'));
    }

my route was

$api->controller('sprawdzaniepingsystemow', 'Monitoring\SprawdzaniePingSystemowController');

and my request was

let us = API.service('sprawdzaniepingsystemow')
        us.getList()
            .then((response) => {
            let dataSet = response.plain()
            $log.log(dataSet);
        }) 

so even my routing was fine restangular expect "sprawdzaniepingsystemow" array not "users" to wrap objet around of it