Глобальные переменные в Ember

Question

Каким будет подходящий метод для хранения глобальной переменной в Ember? Например, у меня есть модель User в Ember, но я всегда хотел бы знать, какой конкретный экземпляр этой модели (включая ее идентификатор, имя, адрес электронной почты и т. Д.) Соответствует зарегистрированному пользователю.

Должен ли я хранить это внутри Ember? Или лучше просто привязать переменную JS к объекту window (например, window.currentUserId = 1;) и использовать это?

Answer 1

Отказ от ответственности: Все методы, показанные ниже, - это мой опыт работы с EmberJS в течение последних нескольких месяцев, а также некоторые обсуждения с моими коллегами. Ничего неправильного, пожалуйста, поднимите свой голос. Мы все находимся на этапе обучения (и ember.js doc отсасывает до maxxx, поэтому будьте добры;)

В настоящее время на моем рабочем месте есть два разработчика, которые используют Ember.js. Мы пришли к выводу, что хранение глобальных переменных в глобальном ApplicationController намного лучше, чем хранение в пространстве имен приложений. Это связано с тем, что извлечение этого значения может быть очень грязным, если оно хранится в пространстве имен приложений. И это хорошо работает и в закрытии, и, следовательно, делает глобальное пространство имен чистым (и относительно свободным от взлома). Вы не хотите, чтобы ваш пользователь делал App.set, чтобы беспорядок с переменной правильно?

.Это основано на 1.0.0 до 4.

Учитывая вас есть эта currentUserId глобальная переменная

1. Сохранение в пространстве имен. jsFiddle demo

   (function() { 
   
       function r() { 
        return Math.round(Math.random()*999); 
       } 
   
       var MyApp = Ember.Application.create({ 
        currentUserId: null, 
        ready: function() { 
         //demo purpose. 
         this.set('currentUserId', r()); 
        }, 
        rootElement: '#demo' 
       }); 
       MyApp.ApplicationView = Ember.View.extend({ 
        templateName: 'application-view', 
   
        //Direct child view 
        innerView: Ember.View.extend({ 
         templateName: 'inner-view', 
         setValue: function() { 
          this.set('controller.namespace.currentUserId', r()); 
         } 
        }), 
   
        //Direct child view, but with a controller attached 
        innerViewWithController: Ember.View.extend({ 
         controller: Ember.Controller.create(), 
         templateName: 'inner-view-with-controller', 
         setValue: function() { 
          this.set('parentView.controller.namespace.currentUserId', r()); 
         } 
        }), 
        getValue: function() { 
         alert(this.get('controller.namespace.currentUserId')); 
        }, 
        setValue: function() { 
         this.set('controller.namespace.currentUserId', r()); 
        } 
       }); 
   })(); 
   

2. против Хранение в глобальном ApplicationControllerjsFiddle demo

   (function() { 
   
       function r() { 
        return Math.round(Math.random()*999); 
       } 
   
       var MyApp = Ember.Application.create({ 
        ApplicationController: Ember.Controller.extend({ 
         currentUserId: null, 
         init: function() { 
          //demo purpose 
          this.set('currentUserId', r()); 
         } 
        }), 
        rootElement: '#demo' 
       }); 
       MyApp.ApplicationView = Ember.View.extend({ 
        templateName: 'application-view', 
   
        //Direct child view 
        innerView: Ember.View.extend({ 
         templateName: 'inner-view', 
         setValue: function() { 
          this.set('controller.currentUserId', r()); 
         } 
        }), 
   
        //Direct child view, but with a controller attached 
        innerViewWithController: Ember.View.extend({ 
         controller: Ember.Controller.create(), 
         templateName: 'inner-view-with-controller', 
         setValue: function() { 
          this.set('parentView.controller.currentUserId', r()); 
         } 
        }), 
        getValue: function() { 
         alert(this.get('controller.currentUserId')); 
        }, 
        setValue: function() { 
         this.set('controller.currentUserId', r()); 
        } 
       }); 
   })(); 
   

Обратите внимание, что:

1. Если вы решили хранить в пространстве имен, вам нужно будет получить доступ к нему через корневого контроллера все время, так что это на самом деле то же самое, что и хранение в applicationController с дополнительным ключевым словом namespace.

2. Если вы решили сохранить его в корне applicationController, по каким-либо мнения, которые происходят от applicationView, вы можете легко получить доступ к переменной в шаблонах с {{variableName}} без обходов точек. По умолчанию Ember.Js ищет переменные через контроллеры.

3. В худшем случае, если ваш внутренний вид должен иметь свой собственный контроллер, доступ к глобальной переменной через корневой контроллер (или пространство имен) немного более болезненен, поскольку контроллеры не связаны, вам нужно будет перевернуть свои представления пока не увидите корневой контроллер. В Ember.JS все представления, по умолчанию, будут иметь набор контроллеров и по умолчанию родительский контроллер. Это означает, что если вы никогда не укажете какой-либо контроллер, все представления потомков фактически связаны с корневым контроллером. Чтобы преодолеть эту проблему, вы можете сделать переменную привязку в контроллере, чтобы легко решить уклонение прохождения.

Я не предлагаю вам поставить такую ​​важную переменную в глобальной window объекта, как это будет легко изменено пользователем (и поднимает любые потенциальные проблемы). Ввод его в глобальном пространстве имен в пространстве имен приложения уголька снижает потенциальную проблему, но если вы не сделать его глобальным

Моим 2 цента;)