Angular как получить всего один документ ajax?

Question

[arhan89]

Сразу хочу извинится за мб глупый вопрос и быдло-код, но всего 1 день изучаю angular и уже продакшен,
нужно реализовать подгрудку данных одного "документа"(json данные {doc_name:[],other_data:[]}) по клику на вот такую ссылку :

<li ng-repeat="doc in order.docs" class="doc">
   <div class="row">
       <div class="col-md-10">
            <a href="#/metal/id={{doc.id}}" ng-click="getDoc(doc.id, doc.type)">{{doc.name}}</a>
      </div>
      <div class="col-md-1">
          <button class="btn btn-xs btn-danger" ng-click="removeDoc(doc.id)"><span class="glyphicon glyphicon-remove"></span></button>
     </div>
  </div>
 </li>

вот такой сервис

service('Doc', function($http,$location) {
    
    $http(
        {
            method: 'POST',
            url: '/erp/documents/getDocument',
            data:{
                doc:id
            }
        }
    ).
        success(function(data, status, headers, config) {
             return data;
        }).
        error(function(data, status, headers, config) {

        });
})

и вот такой контроллер

.controller('DocumentsCtrl', function($scope, Doc){
//end Documents controller

$scope.Controler = {
name: 'DocumentsCtrl'
}

$scope.openDoc = Doc;

$scope.getDoc = function(doc_id, doc_type) {

}
})

настройки приложения

app.config(['$routeProvider', function($routeProvider) {
    $routeProvider.when('/', {
        templateUrl: '/makeup/empty.html',
        controller: 'DefaultCtrl'
    });

    $routeProvider.when('/metal/:id', {
        templateUrl: '/makeup/metal.html',
        controller: 'DocumentsCtrl'
    });

    $routeProvider.otherwise({
        redirectTo: '/'
    });
}])

Answer 1

[Сергей Протько]

angular.module('app').factory('doc', [
    '$http',
    function ($http) {
     
          return function (id) {
                return $http.get(...).then(function (response) {
                      return response.data;
                });
          }
    }
]);

angular.module('app').controller('MyCtrl', [
    '$scope', 'doc',
    function ($scope, doc) {
         $scope.getDoc = function(id) {
              doc(id).then(function (yourDocWillBeHere) {
                   
              }
         }
    }
]);

Answer 2

[_ _]

А что будет, если перейти по #/metal/id={{doc.id}}?
Если при клике на ссылку вам надо отобразить страницу с детальной информацией об объекте, то вам надо смотреть в сторону resolve секции в объявлении $routeProvider.when
В текущей реализации вы отбираете у angular.js его хлеб.
Это может выглядеть как-то так

// Это контроллер, который будет привязан к содержимому ng-view после перехода по соотв. url
// Внедряемая зависимость document возникает в момент разрешения зависимостей при активации роута
app.controller('DocumentController', ['$scope','document', function($scope, doc){
     $scope.document = doc;
}]);

app.config(['$routeProvider',, function($routeProvider) {
    $routeProvider.when('/metal/:type/:id', {
        templateUrl: '/makeup/metal.html',
        controller: 'DocumentController',
        // Данная секция отвечает за разрешение зависимостей роута. Объекты из этой секции внедряются в указанный контроллер с соотв. именами       
        resolve: {
            document: ['doc','$route', function(doc,$route){
                 // Мы вытаскиваем из роута параметры id и type, запрашиваем у фабрики соотв. объект.           
                 // Фабрика в ответ возвращает нам promise, который мы возвращаем как зависимость, которая должна быть разрешена, и инициирует http-запрос. После получения объекта фабрика разрешает promise, инстанцируется контроллер с внедрением полученного объекта и отображается шаблон
                 return doc($route.current.params.id, $route.current.params.type);
            }]
        }
    });

Comments

[Сергей Протько]

@AMar4enko, вы же знаете что $http уже возвращает промис и не обязательно писать эти все d - $q.defer()?

[_ _]

Знаю, пробел оказался в другом месте.
This method returns a new promise which is resolved or rejected via the return value of the successCallback, errorCallback
Спасибо за наводку :)

Answer 3

[arhan89]

Спасибо, люди добрые, действительно помогли рабочим примером (если совместить оба ответа) и дали указатели в какую сторону читать api, часовой googl-инг не помог, а вы за полчаса 2 толковых ответа.