如何共享服务的动态控制器和指令之间的数据 [英] How share Service dynamic data between Controllers and Directives

查看:220
本文介绍了如何共享服务的动态控制器和指令之间的数据的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想知道用什么方式,如果我需要我的服务,分享它的控制器之间的动态数据,指令,等我之所以提到动态的,是因为我想加载新的数据,并将这些数据需要任何其他控制器,指令等。例如可用,如果指令生成一个UL李,那就要重新生成,如果服务中的数据发生了变化!

I'd like to know what pattern to use, if I need my Service to share it's dynamic data between Controller, Directives, etc. The reason I mention dynamic, is because I'd like to load new data and this data needs to be available in any other Controller, Directive, etc. For example, if a Directive generates a UL LI, it would have to re-generate it if the data inside the Service has changed!

我刚打开以下(<一个href=\"http://stackoverflow.com/questions/19126172/how-to-create-reset-method-in-service-that-return-promise\">How创造服务reset()方法返回已答应么?),有人指着我说,我应该使用Observer模式。这我很感激,我很快就写了这是什么,我需要做的和意见将是极为AP preciated(的 http://jsbin.com/epAMaP/1

I've initially opened the following ( How to create reset() method in Service that return promise? ) and someone pointed to me that I should use the Observer Pattern. Which I'm very grateful and I wrote this very quickly as a spike of what I need to do and comments would be extremely appreciated ( http://jsbin.com/epAMaP/1 )

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

MyApp.config(function($locationProvider){

  $locationProvider.hashPrefix('!');

});

MyApp.factory('MyService', function($timeout){

    var data;

    var loadData = function(){

        data = {
            foo: "bar",
            time: new Date()
        };

        return data;

    };

    return {

        refresh: function(){

            loadData();

        },

        getData: function(){

            return loadData();

        }

    };

});

MyApp.controller('MyCtrl', function($scope,MyService,$timeout){

  $scope.foo = "Service share data";

  $scope.data = MyService.getData();

  $scope.$on("eventFoo", function(){
    console.log("Data has changed!");
    console.log($scope.data);
  });

  $timeout(function(){
    MyService.refresh();
    $scope.$apply(function(){
        $scope.data = MyService.getData();

        $scope.$emit("eventFoo");
    });
  }, 3000);

});

MyApp.directive('myDirective', function(MyService,$timeout){

    return {
        restrict: 'A',
        link: function(scope, elem, attrs){
            scope.$on("eventFoo", function(){
                console.log("Event foo triggered!");

                scope.data = MyService.getData();

                console.log(scope.data);
            });
        }
    };

});

我认为这将解决大部分的问题,我但有我需要记住一些东西。我将加载数据来自$ HTTP GET,所以我觉得我需要每次我需要更新或加载数据,然后触发正确的事件时间至少使用一个承诺。

I think this would solve most of my problems but there's something that I need to remember. The data that I'll load comes from $http GET, so I think that I need to use at least a promise every time I need to update or load data, then trigger the right event.

我缺乏有经验的AngularJs开车送我怀疑我的想法,所以任何帮助或建议非常AP preciated!

My lack of experience with AngularJs drive me into question my thoughts, so any help or advice is extremely appreciated!

感谢您看!

推荐答案

我不知道这是否帮助,但我最近通过使用共享两个控制器和服务之间的数据

I don't know if this helps but I recently shared data between two controllers and a service by using

$ rootScope。$广播火灾和
$范围。$关于赶上变化

据我可以告诉它棱角分明的实现观察者模式的

as far as I can tell it is Angular's implementation of the observer pattern

这篇关于如何共享服务的动态控制器和指令之间的数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆