使用 restangular 扩展 HotTowel Dataservice 以使用 REST 的问题

Question

我是第一次使用 Angular 和 Hottowel，我想扩展数据服务以利用 restangular 的功能向 hottowel 应用程序的其余部分提供 REST 数据。

我已经包含了 restangular 并让它成功获得了 REST。

我意识到 restangular 文档讨论了直接在控制器中使用 promise，所以我现在想知道将它包含在数据服务中是否可行。

有问题的函数是 getJobs。它是唯一使用 restangular 的函数。它在数据服务中定义为一个函数，并添加到数据服务变量中以公开它。它在仪表板控制器中具有匹配功能。它还添加到仪表板控制器中的承诺列表中。我已经确认函数 returns restangular 函数中的对象列表。即使 promise 执行了 then 子句，我在仪表板控制器中什么也得不到。

非常感谢任何指导。

谢谢

西蒙

代码如下：-

dataservice.js

(function () {
'use strict';

angular
    .module('app.core')
    .factory('dataservice',dataservice);

dataservice.$inject = ['$q','Restangular'];
/* @ngInject */
function dataservice($q,Restangular) {
    var service = {
        getPeople: getPeople,
        getMessageCount: getMessageCountXXX,
        getJobs: getJobs
    };

    return service;



    function getJobs() {
        var jobs = [];
        var baseJobs = Restangular.all('jobs');

        baseJobs.getList().then(function(jobs) {
            console.log("Within dataservice.getJobs");
            console.log(jobs);

        });
        return $q.when(jobs);
        console.log("EndofgetJobspost return shouldnt get here");       
    }


    function getMessageCountXXX() { return $q.when(72); }

    function getPeople() {
        var people = [
            {firstName: 'John', lastName: 'Papa', age: 25, location: 'Florida'},
            {firstName: 'Ward', lastName: 'Bell', age: 31, location: 'California'},
            {firstName: 'Colleen', lastName: 'Jones', age: 21, location: 'New York'},
            {firstName: 'Madelyn', lastName: 'Green', age: 18, location: 'North Dakota'},
            {firstName: 'Ella', lastName: 'Jobs', age: 18, location: 'South Dakota'},
            {firstName: 'Landon', lastName: 'Gates', age: 11, location: 'South Carolina'},
            {firstName: 'Haley', lastName: 'Guthrie', age: 35, location: 'Wyoming'}
        ];
        return $q.when(people);
    }
}   
})();

dashboard.Controller.js

(function () {
'use strict';

angular
    .module('app.dashboard')
    .controller('DashboardController', DashboardController);

DashboardController.$inject = ['$q', 'dataservice', 'logger'];
/* @ngInject */
function DashboardController($q, dataservice, logger, api) {
    var vm = this;
    vm.news = {
        title: 'helloWorld',
        description: 'Hot Towel Angular is a SPA template for Angular developers.'
    };
    vm.messageCount = 0;
    vm.people = [];
    vm.jobs = [];
    vm.title = 'Dashboard';


    activate();

    function activate() {
        var promises = [getMessageCount(), getPeople(), getJobs() ];
        return $q.all(promises).then(function() {
            logger.info('Activated Dashboard View');
        });
    }

    function getMessageCount() {
        return dataservice.getMessageCount().then(function (data) {
            vm.messageCount = data;
            return vm.messageCount;
        });
    }

    function getPeople() {
        return dataservice.getPeople().then(function (data) {
            vm.people = data;
            return vm.people;
        });
    }

    function getJobs() {
        console.log("Within getJobs");
        return dataservice.getJobs().then(function (data) {
            vm.jobs = data;
            console.log(data);
            return vm.jobs;
        }, function (reason){
            console.log(reason);
        });
    }
}



})();

dashboard.html的相关部分：-

 <div class="row">
            <div class="col-md-6">
                <div class="widget wviolet">
                    <div ht-widget-header title="Jobs"
                         allow-collapse="true"></div>
                    <div class="widget-content text-center text-info">
                        <table class="table table-condensed table-striped">
                            <thead>
                                <tr>
                                    <th>Name</th>
                                    <th>Description</th>
                                    <th>Status</th>
                                    <th>Category</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr ng-repeat="p in vm.jobs">
                                    <td>{{p.name}}</td>
                                    <td>{{p.description}}</td>
                                    <td>{{p.status}}</td>
                                    <td>{{p.category}}</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                    <div class="widget-foot">
                        <div class="clearfix"></div>
                    </div>
                </div>
            </div>

Answer 1

问题是，在您的数据服务 getJobs() 函数中，您没有返回来自 ajax 调用的作业列表。使用以下代码更改该功能。

function getJobs() {

        var baseJobs = Restangular.all('jobs');

        return baseJobs.getList().then(function(jobs) {
            console.log("Within dataservice.getJobs");
            console.log(jobs);
            return jobs;

        });
    }

使用 restangular 扩展 HotTowel Dataservice 以使用 REST 的问题

Problems extending HotTowel Dataservice to consume REST using restangular

angularjs

hottowel

restangular