AngularJS:我需要从 angular 外部更新服务 [英] AngularJS: I need to update a service from outside of angular

问题描述

我有一个名为播放器"的服务，我需要在 Flash 对象加载完成后更新该服务.

I have a service called 'player' and I need to update the service when a flash object is finished loading.

mySongPlayer.factory('player', function() {

var isPlayerLoaded = false;
var playerHolder = '';

window.playerReady = function(thePlayer) {
    playerHolder = window.document[thePlayer.id];
    addListeners();
    isPlayerLoaded = true;
}

var flashvars = {
    file:"", 
    autostart:"true",
    skin: "/skins/glow/glow.zip",
}

var params = {
    allowfullscreen:"false", 
    allowscriptaccess:"always"
}

var attributes = {
    id:"player1",  
    name:"player1"                    
}

swfobject.embedSWF("/player.swf", "player_placeholder", "100%", "40", "9.0.115", false, flashvars, params, attributes);

var playObj;
return playObj || (playObj = {
    currentId: 'test', currentUrl: 'url', playerHolder: ''
});
});​

我知道如何使用

angular.element(DOMElement).injector().get('player')

但它返回一个新的 'player' 实例，而我需要更新模块中已经创建的实例.有没有办法做到这一点?我只想要播放器的一个实例，但我需要从 javascript 外部对其进行初始化.

but it returns a new instance of 'player' while I need to update the instance already created in the module. Is there a way to do this? I only want one instance of the player, but I need to initialize it from outside javascript.

推荐答案

好吧，我真的看不到你在做什么，但你可能已经完成了 1/2 的工作.

Well, I can't really see all of what you're doing, but you're probably about 1/2 way there.

这是我将要描述的工作内容

injector.get() 应该返回与您的应用程序中相同的 Service 实例.您可能只是看到一个问题，让您认为您有一个不同的实例.

injector.get() should be returning the same instance of Service as what's in your app. You're probably just seeing an issue that makes you think you have a different instance.

所以你需要做的是:

• 确保您从服务中放入的范围是一个对象引用.如果是原始类型，则不会是相同的引用，因此不会更新.
• 请务必使用 angular.element(DOMElement).scope() 去除 angular 元素的范围，然后对其调用 $apply().

• Make sure that what you're putting in your scope from your service is an object reference. If it's a primitive type, it won't be the same reference so it won't update.
• Be sure to get the scope off of your angular element with angular.element(DOMElement).scope() and then call $apply() on it.

代码如下:

app.controller('MainCtrl', function($scope, myService) {
  // Set a var on the scope to an object reference of the
  // (or from the) service.
  $scope.myService = myService;
});

app.factory('myService', function(){
  return {
    foo: 'bar'
  };
});

//do a little something to change the service externally.
setTimeout(function(){
  //get your angular element
  var elem = angular.element(document.querySelector('[ng-controller]'));

  //get the injector.
  var injector = elem.injector();

  //get the service.
  var myService = injector.get('myService');

  //update the service.
  myService.foo = 'test';

  //apply the changes to the scope.
  elem.scope().$apply();
}, 2000)

其他想法:

• 您可能希望将 $window 注入您的服务，而不是使用 window 对象，以维护您的服务的可测试性.
• 指令可能是 DOM 操作的更好选择，例如创建 Flash 电影播放器​​.

• You probably want to inject $window into your service, rather than use the window object, to maintain the testability of your service.
• A directive is probably a better choice for DOM manipulation such as the creation of a Flash movie player.

这篇关于AngularJS:我需要从 angular 外部更新服务的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！