Question

我正在使用http://jsfiddle.net/wqf9p56a/构建一个小型双语应用。我想在每个视图（控制器）中都有一个语言切换器。我试图弄清楚如何将代码负责语言切换到每个控制器。代码如下所示：

var langSwitch =  $Scope.setLang = function (langKey) {
    $translate.use(langKey);
};

到目前为止，我认为我可以创建一个看起来像这样的工厂：

app.factory('langSwitch', function ($rootScope, $translate) {
    var langSwitch =  $rootScope.setLang = function (langKey) {
        $translate.use(langKey);
    };
    return langSwitch;
});

并将其注入控制器：

app.controller('HomeCtrl', function (langSwitch) {
  // normal controller code here 
});

这可行，但1）我正在使用$ rootScope，我觉得这是不好的做法＆amp; 2）jsHint尖叫“langSwitch”没有定义。也许有一种更简单的方法可以使函数全局化而不将其放入每个控制器中？我仍然是Angular的新手，所以不要尖叫我:)谢谢。

修改

我的观点：

<button ng-click="setLang('en_GB')">English</button>
<button ng-click="setLang('pl_PL')">Polish</button>

Answer 1

虽然你有了这个想法，但是你有点过于复杂。您可以按如下方式声明服务：

app.service('langSwitch', function ($translate) {
    this.setLang = function (langKey) {
        $translate.use(langKey);
    };
});

然后在负责lang切换的控制器中注入langSwitch，就像你已经做的那样。无需在服务中注入$rootScope。

Answer 2

除非您需要在应用程序中处理某些全局事件，否则确实不需要$ rootScope。所有角度的服务和工厂都是默认的单件。这意味着一旦它被创建，它将在每个被声明为依赖项的地方作为相同的实例传递。因此，如果您想在不同控制器之间共享数据和功能 - 服务将很好。您可以将工厂代码更改为：

app.factory('langSwitch', function($translate) {
  return {
    setLang: function(langKey) {
      $trasnlate.use(langKey);
    };
  };
});

AngularJs - 在每个控制器中包含我的服务的最佳方式？

2 个答案: