I
I
Ilya Oskin2016-07-26 16:36:27
Django
Ilya Oskin, 2016-07-26 16:36:27

How to pass id parameter to controller?

Good afternoon! I am making a SPA application on Django + Angular, the server and client parts communicate only through the rest api. The situation is as follows: A list of cases is displayed on the main page, and by clicking on one of them, a detailed description of it should open, but there is still not enough knowledge to correctly pass the case id to the $http service of the corresponding controller, I saw only examples in the tutorials using a php script , where id was passed.
app.js

var app = angular.module('uniApp', ['ngRoute']);

angular.
  module('uniApp').
  config(['$locationProvider', '$routeProvider',
    function config($locationProvider, $routeProvider) {
      $locationProvider.html5Mode(true);

      $routeProvider.
        when('/', {
          controller : 'mainCtrl',
          templateUrl : 'media/views/main.html'
        }).
        when('/:id', {
          controller : 'detailCtrl',
          templateUrl : 'media/views/detail.html'
        }).
        otherwise('/');
    }
  ]);

app.controller('mainCtrl', function ($scope, $http) {
  $http.get('http://127.0.0.1:3000/api/v0/cases/').success(function(data){
    $scope.cases = data;
  });
});
app.controller('detailCtrl', function($scope, $http) {
  $http.get('http://127.0.0.1:3000/api/v0/cases/<:id кейса>').success(function(data){
    $scope.case = data;
  });
});

Rest api responses:
GET /api/v0/cases/
[
    {
        "id": 7,
        "name": "AMA",
        "preview": "http://127.0.0.1:3000/media/images/ama_bh_eBLMABd.jpg",
        "slider_preview": "http://127.0.0.1:3000/media/images/case_ama_pQjtadA.jpg",
        "url": "http://127.0.0.1:3000/api/v0/cases/7/"
    },
    {
        "id": 8,
        "name": "Nana",
        "preview": "http://127.0.0.1:3000/media/images/ama_bh_9MYiC6t.jpg",
        "slider_preview": "http://127.0.0.1:3000/media/images/case_ama_uJ2DQVT.jpg",
        "url": "http://127.0.0.1:3000/api/v0/cases/8/"
    }
]

GET /api/v0/cases/7/
{
    "name": "AMA",
    "slider_preview": "http://127.0.0.1:3000/media/images/case_ama_pQjtadA.jpg",
    "articles": [
        {
            "picture": "http://127.0.0.1:3000/media/images/ama_bh_IEc3Z4X.jpg",
            "caption": "sdedfsdd"
        },
        {
            "picture": "http://127.0.0.1:3000/media/images/ama_bh_rbXJoIB.jpg",
            "caption": "ssddscd"
        }
    ]
}

Answer the question

In order to leave comments, you need to log in

3 answer(s)
A
Alexey Yarkov, 2016-07-26
@Oskin1

https://docs.angularjs.org/api/ngRoute/service/$ro...
Don't know how else to explain in more detail

M
Michael, 2016-07-26
@springimport

How about this ?
And in general .

R
Roman Ogarkov, 2016-07-26
@ogarich89

Read about the $routeProvider service
https://docs.angularjs.org/api/ngRoute/provider/$r...
Use the $http service for primitive actions

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question