标签: angularjs-service

我的app.js样子

var app = angular.module('pennytracker', [
  '$strap.directives',
  'ngCookies',
  'categoryServices'
]);

app.config(function($routeProvider) {
  console.log('configuring routes');
  $routeProvider
    .when('/summary', { templateUrl: '../static/partials/summary.html'})
    .when('/transactions', { templateUrl: '../static/partials/transaction.html', controller: 'AddTransactionController' })
});

而我的app/js/services/categories.js样子

angular.module('categoryServices', ['ngResource']).
  factory('Category', function($resource){
    return $resource(
      '/categories/:categoryId',
      {categoryId: '@uuid'}
    );
  });

我有一条路线

  .when('/transactions', { templateUrl: '../static/partials/transaction.html', controller: 'AddTransactionController' })

我的控制器app/js/controllers/transactionController.js看起来像

function AddTransactionController($scope, $http, $cookieStore, Category) {
 // some work here
  $scope.category = Category.query();
  console.log('all categories - ', $scope.category.length);
}

当我运行我的应用程序时,我看到console.log为

all categories -  0 

我在这做错了什么？

我是一个有角度的新手,我正在构建一个应用程序,有一件事让我感到困惑的是有几种方法可以定义服务,而且我从这个链接中读到更多:如何定义服务 然后它似乎没有大的区别定义服务的方式.

但我刚才注意到一个与众不同的区别:

看到我从这里得到的这项服务http://jsfiddle.net/2by3X/5/

var app = angular.module('myApp', []);
app.service('test', function($timeout, $q) {
  var self = this;
  this.getSomething = function() {
    return self.getData().then(function(data) {
      return self.compactData(data);
    });
  };
  this.getData = function() {
    var deferred = $q.defer();

      $timeout(function() {
          deferred.resolve("foo");
      }, 2000);
    return deferred.promise;
  };
  this.compactData = function(data) {
    var deferred = $q.defer();

    console.log(data);

    $timeout(function() {
        deferred.resolve("bar");
    }, 2000);
    return deferred.promise;
  };
});

如果我使用"factory"定义此服务,如下所示,一个函数不能调用该服务的其他功能.

app.factory('test', function($timeout, $q) {
  return {
      getSomething : function() {
    return getData().then(function(data) {
      return compactData(data); …

我正在学习AngularJS的方法.我基本上已经掌握了Angular处理依赖注入的方式,但是我找不到答案的差距.

假设我有一个服务,它根据用户的查询从Web检索数据; 它可能看起来像这样:

var webBasedServiceModule = angular.module('WebBasedService', []);

webBasedServiceModule
    .factory('webBasedService', function ($http) {
        var rootUrl = "http://example.com/myApi?query=";
        return {
            getData: function(query) {
                return $http.get(rootUrl + query)
                    .then(function(httpCallbackArg) {
                        return doSomething(httpCallbackArg);
                    });
            }
        }
    });

我正在注入$ http服务,所以我可以模拟它进行测试.但是,我已经在课堂上硬编码了我的Web服务的根URL.理想情况下,我想将此URL与服务类分离,并将其作为依赖项注入.但是,我没有看到将字符串或其他基元注入角度工厂函数的方法.理想情况下,我希望代码看起来像这样:

var webBasedServiceModule = angular.module('WebBasedService', []);

webBasedServiceModule
    .factory('webBasedService', function ($http, rootUrl) {
        return {
            getData: function(query) {
                return $http.get(rootUrl + query)
                    .then(function(httpCallbackArg) {
                        return doSomething(httpCallbackArg);
                    });
            }
        }
    });

我能看到的一个解决方案就是创建一个UrlProviderService并将该服务注入WebBasedService模块,然后调用urlProvider.Url或类似.这似乎有点臭:为一个配置数据创建一个全新的服务似乎有些过分.我甚至可以想像,我可能会创建一个服务,这是一个字符串,像这样:

var urlServiceModule = angular.module('UrlService', []);

urlServiceModule
    .factory('rootUrl', …

我知道如何使用$parse服务设置对象'"deep"属性,就像在这篇文章中一样.

但是我如何删除深层财产？不要将其分配给null:

$parse('very.very.deep.property').assign($scope, null);

,但实际上删除它,就像我们在JavaScript中这样做:

delete $scope.very.very.deep.property;

我正在尝试构建一个工厂作为我的数据库模型的临时区域,以及一个api来执行基本的CRUD调用.我希望能够通过将数据存储在服务或工厂中来访问数据,并保持api方法,以便我可以在控制器中执行这些操作.

$scope.folders =  Folders.data(); // for a factory
$scope.folders = Folders.data; // for a Service

Folders.create({name: "My Stuff, $oid: { 5fwewe033333 }, user_id: CurrentUser.id"});

目前我在控制器中使用这样的文件夹工厂.

Folders.foldersData().success( function(data, status) {
   $scope.folder = data;
})
.error( function(data,status) {
   Flash.warning("There was a problem fetching your data");
});

我知道我可以在控制器中解决一个承诺,但是我正在研究项目的大小,我喜欢在服务中访问文件夹模型的想法,而不必进行服务器调用来同步每次我做出改变时的数据.

angular.module('cmsApp')
  .factory('Folders', function($http, $q){

    var folders = {};
    var messageWarn = "Upload Retrival Failed.";


    return {
      get: function(){
        var defered = $q.defer();

        $http.get('/folders').success( function ( data, status ) {
          defered.resolve(data);
        })
        .error( function ( data, …

我想在调试时将日志消息输出到控制台.在控制器中工作正常,但不能让它在模块配置块中工作,例如

angular.module('MyApp', [])
  .run(function($state){
    // run stuff here
  });
  .config(function($logProvider){
    $log.debug('Config debug message');
  });

我收到一个错误:

error TypeError: Cannot read property 'debug' of undefined

是否可以在模块的配置块中使用logProvider？

我有一个服务,使用$ http加载数据并返回一个promise(简化为简洁):

angular.module('myApp').factory('DataService', ['$http', function($http) {
  function unwrapFriendList(data) {
    ...
    return unwrappedFriendList;
  }

  return {
    getFriendList: function() {
      return $http.get('/api/friends').then(unwrapFriendList);
    }
  }
}]);

以下是在解析promise并将结果存储在$scope.friends以下内容后使用该数据的视图:

<div ng-repeat='friend in friends'>
  {{friend.firstName}} {{friend.lastName}}
</div>

在将数据加载到控制器中时,我遇到了几种方法.

选项1:使用通过ng-route加载的数据的控制器 resolve

angular.module('myApp').controller('FriendListCtrl', ['$scope', 'friendList', function($scope, friendList) {
  $scope.friends = friendList;
}]);

路线部分:

angular.module('myApp', ...).config(function($routeProvider) {
  $routeProvider
    .when('/friends', {
      templateUrl: 'views/friends.html',
      controller: 'FriendListCtrl',
      resolve: {
        friendList: ['DataService', function(DataService) {
          return DataService.getFriendList();
        }]
      }
    })
    ...
});

选项2:自动触发数据加载的控制器

angular.module('myApp').controller('FriendListCtrl', ['$scope', 'DataService', function($scope, DataService) {
  DataService.getFriendList().then(function(friendList) {
    $scope.friends …

嗨我在laravel 5现有验证中遇到了问题.

在我的控制器和请求中.

class PostEmailRequest extends Request{
/**
 * Get the validation rules that apply to the request.
 *
 * @return array
 */
public function rules()
{
    return [
        'email' => 'required|max:255',
    ];
}}

它将返回电子邮件的验证作为示例.我想用angularjs做什么是我想要捕获验证并在我的前端表单上获取它.它不会重新加载页面.你对这个有什么想法吗？

我的应用程序中的表单将通过angularjs发送数据.$ http post url"app/postPage"如果它的错误高于我的代码将$ validation-> messages()发送到我的angularjs.

angularjs中服务(或工厂)的生命周期是什么？何时重新初始化？

给定一个测试过滤器,假设这个'大写'过滤器将大写每个单词的第一个字母:

return function (input) {
  return (!!input) ? input.replace(/([^\W_]+[^\s-]*) */g, function (txt) {
    return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
  }) : '';
}

如何从浏览器的JavaScript控制台测试此过滤器？