“SyntaxError: Unexpected token <” when using $routeparams

Question

Have an angular app with mongodb, express and nodejs. In the app i have a list of flats and want to add "Edit" option for every flat. This is part of my api.js:

api.route('/flats/:id')
  .get(function(req, res){
    Flat.findById(req.params.id, function(err, post){
      if(err){
        res.send(err);
      }
      res.json(post)
    })
  })
  .put(function(req, res){
    Flat.findById(req.params.id, function(err, flat){
      if(err){
        res.send(err);
      }
      return('TODO POST FLAT WITH ID');
    })
  })

This part of code working, and in postman i have an rightly array. This is part of my routes file:

angular.module('appRoutes', ['ngRoute', 'ngResource'])
  .config(function($routeProvider, $locationProvider){
    $routeProvider
      .when('/flats/:id', {
        controller: 'FlatController',
        templateUrl: 'app/views/pages/edit.html'
      })          
    });

Next part - this is a table with all flats. On click i want to open a page with a single flat

<table class="table table-bordered table-hover">
  <thead>
    <tr>
      <th ng-repeat="field in flat.fields">
        {{ field }}
      </th>
    </tr>
  </thead>
  <tbody>
    <tr ng-click="flat.showflat(flatone._id)" ng-repeat="flatone in flat.flats">
      <td ng-repeat="field in flat.fields">
        {{ flatone[field] }}
      </td>
    </tr>
  </tbody>
</table>

This is part of my controller:

angular.module('flatCtrl', ['flatoneService'])
  .controller('FlatController', ['FlatOne', '$filter', '$location', '$timeout', '$interval', '$routeParams', function(FlatOne, $filter, $location, $timeout, $interval, $routeParams){
    vm = this;
    vm.flats = FlatOne.query();
    vm.showflat = function(_id){
      var flatId = _id;
      vm.flatsToEdit = FlatOne.get({id: $routeParams._id});
      $location.url('/flats/edit');
    }
  }])

In this controller i have rightly _id, but $routeParams is undefined, and i don't understand why.

This is my service:

angular.module('flatoneService', [])
  .factory('FlatOne', function ($resource){
    return $resource('/api/flats/:id', {id:'@_id'}, {
      'update': {method: 'PUT'}
    });
  });

In result when i click to the row i have a rightly url, for example http://localhost:3000/flats/55c59f11cbe8d2b4105c149c , and an error: SyntaxError: Unexpected token <. I expect to get app/views/pages/edit.html, but get a html code of my main page.

SyntaxError: Unexpected token < at eval (native) at https://code.jquery.com/jquery-1.11.3.min.js:2:2622 at Function.m.extend.globalEval ( https://code.jquery.com/jquery-1.11.3.min.js:2:2633 ) at m.ajaxSetup.converters.text script ( https://code.jquery.com/jquery-1.11.3.min.js:5:26520 ) at Pb ( https://code.jquery.com/jquery-1.11.3.min.js:5:18363 ) at x ( https://code.jquery.com/jquery-1.11.3.min.js:5:21793 ) at m.ajaxTransport.a.send.b ( https://code.jquery.com/jquery-1.11.3.min.js:5:26030 ) at Object.m.ajaxTransport.a.send ( https://code.jquery.com/jquery-1.11.3.min.js:5:26134 ) at Function.m.extend.ajax ( https://code.jquery.com/jquery-1.11.3.min.js:5:21570 ) at Function.m._evalUrl ( https://code.jquery.com/jquery-1.11.3.min.js:5:22649 )

Answer 1

您应该更正FlatOne.get调用，您的$routeParam应该是$routeParams.id /可能是因为您已经传递了该参数以用作_id ，然后将get id更改为_id因为您有{id:'@_id'}您的$resource 。

vm.flatsToEdit = FlatOne.get({_id: _id});

Answer 2

You're already passing id to show function:

ng-click="flat.showflat(flatone._id)"

so I think there is no need to use $routeParams:

vm.showflat = function(_id){
  var flatId = _id;
  //vm.flatsToEdit = FlatOne.get({id: $routeParams._id});
  vm.flatsToEdit = FlatOne.get({id: _id}); // may be this?
  $location.url('/flats/edit');
}