如何在模板中访问全局变量?

Dmi*_*tro 1 ember.js ember-cli

我想创建具有我需要从REST API获取的设置的全局对象.我需要向REST API发出一个请求并获取设置,之后我想从任何控制器和任何模板访问这些设置.你有什么建议,这个问题的最佳实践是什么?

Sus*_*ant 6

概念

好的做法是使用初始化程序.它们允许将任何数据注入路径,控制器或任何其他类型的对象.

让我们举个例子( 来自Ember.js官方网站的例子 )

1. 你有一个Application,你有这样的logger服务 -

App = Ember.Application.extend();

App.Logger = Ember.Object.extend({
  log: function(m) {
    console.log(m);
  }
});
Run Code Online (Sandbox Code Playgroud)

2. 现在你希望这个功能log可以routes像这样 -

App.IndexRoute = Ember.Route.extend({
  activate: function(){
    // The logger property is injected into all routes
    this.logger.log('Entered the index route!');
  }
});
Run Code Online (Sandbox Code Playgroud)

3. 告诉ember注入一个名为Logger所有路由的对象.使用initializer像这样

//I want to inject something
Ember.Application.initializer({

  //this dependency name is logger
  name: 'logger',

  //whenever ember runs
  initialize: function(container, application) {

    //register my logger object under a name
    application.register('logger:main', App.Logger);

    //and use this service 'logger' in all 'routes'
    application.inject('route', 'logger', 'logger:main');
  }
});
Run Code Online (Sandbox Code Playgroud)

有了这个,您可以在所有路由和控制器中使用您的应用程序级数据/代码.

在控制器中获取数据后,您可以非常轻松地在模板中使用它.

如何使用初始化程序进行API调用?

初始化程序可用于在解决其他一些服务后运行.就像我们的情况一样store.store是我们需要以良好的方式对服务器进行API调用的对象(我们可以使用$.getJSON()或其他任何问题)

告诉初始化器在store加载后运行

//I want to inject something but only after store resolved
Ember.Application.initializer({

  //this dependency name is logger
  name: 'logger',

  //wait for store object to be loaded, we need it to make API call
  after : 'store',


  //whenever ember runs
  initialize: function(container, application) {

      //grab the store object from container
      var store = container.lookup('store:main');

      //now you the store make that API call
      self.store.find('user',{current:true}).then(function(data){

            //we have the data we can inject it
            data = data.get('firstObject');
            container.lookup('controller:base').set('user', data);

            //user lookup success
            console.log("We have found an user. Yeah ember rocks.");

       });
   }

});
Run Code Online (Sandbox Code Playgroud)