javascript - AngularJS : Service object empty

标签 javascript angularjs angularjs-service angularjs-controller

我是 Angular 的新手,我一直在努力尝试调用在我的一个 Controller 中使用 Restangular 的工厂。这是 Controller :

'use strict';
angular.module('myApp')
  .controller('UserCtrl', ['WebApi', function($scope, WebApi) {
    $scope.user = WebApi.getProfile(1);
  }
]);

每当我在 Controller 中调用 WebApi 工厂时,WebApi 对象都是空的。当我调用该方法时,它将返回未定义。当我在控制台中记录对象时,我得到

Object {}

这是我的工厂:

"use strict";
angular.module("myApp.services", ["restangular"])
  .factory("WebApi", ["Restangular", function(Restangular) {
    var getProfile;
    Restangular.withConfig(function(RestangularConfigurer) {
      RestangularConfigurer.setBaseUrl("http://127.0.0.1:3000/api/v1");
    });
    getProfile = function(id) {
      Restangular.one("users", id).get().then(function(data) {
        return data;
      });
    };
  }
]);

应用程序模块:

'use strict';
angular.module('myApp', ['ngCookies', 'ngSanitize', 'ui.router', 'myApp.services']);

它包含在我的索引 html 中:

    <script src="scripts/app.js"></script>
    <script src="scripts/controllers/main.js"></script>
    <script src="scripts/services/webapi.js"></script>
    <script src="scripts/controllers/user.js"></script>

我做错了什么?预先感谢您。

最佳答案

这是一个异步调用:

Restangular.one("users", id).get().then(function(data) {
    return data;
  });

并且它不会向其父函数返回任何内容。

您可以从父函数返回一个 Promise,并在我上面提到的 then 回调中解析它(而不是 return data;)。

另一件事是工厂需要返回一个对象才能使其属性可用。这里有一些非常好的答案:angular.service vs angular.factory

<小时/>

更新

根据评论中的问题,这就是我所说的必须返回对象的意思:

angular.module("myApp.services", ["restangular"])
  .factory("WebApi", ["Restangular", function(Restangular) {
    var getProfile;
    getProfile = function(id) {
        // this function is not visible from outside
    };
    // but if you do this:
    return {
        someValue: 3, // accessible via WebApi.someValue
        someFunction: function(){alert('me too')},
        getProfile: getProfile  // now it works as WebApi.getProfile(),
        etc: etc
    }
    // all of these above are now accessible
  }
]);

请参阅此处的简单示例:http://plnkr.co/edit/KGUqCVJqeEcD5d6m7sVw?p=preview

关于javascript - AngularJS : Service object empty,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24054582/

相关文章:

javascript - 将焦点设置到下一个输入元素

javascript - AngularJS - 从服务访问 Controller 内的元素

javascript - 具有多种目标类型的加载器服务

javascript - AngularJS 拦截器永远不会捕获 401 错误

javascript - 更改帖子形式

javascript - Scrollmagic - 使用多个补间更改主体和 div 背景颜色

javascript - Chart.js 时间刻度图 - xAxis 标签

javascript - 在解决服务方法上的 promise 之前,它会转到主方法的 promise

javascript - 错误: $injector:unpr Unknown Provider in angularjs with gulp-uglify

javascript - 如何在 Angular 服务之间正确共享数据