Блог

Главная - Вопросы по программированию - Разница в $interpolate между AngularJS 1.0 и 1.2

Разница в $interpolate между AngularJS 1.0 и 1.2

#javascript #angularjs #interpolation #angular-filters

#javascript #angularjs #интерполяция #угловые фильтры

Вопрос:

Я пишу фильтр для форматирования адресов в одной строке. Объект, который будет передан в фильтр, имеет формат:

 {
  Line1: "123 Main St.",
  Line2: "Apartment 2", // Optional
  City: "Chicago",
  State: "IL",
  Zip: "60623"
}

Пока у меня есть следующее:

 angular.module('myApp')
  .filter('address', function ($interpolate) {
    return function (input, template) {

      if (input === null || !angular.isDefined(input)) {
        return input;
      }

      // template is optional. If not provided, use the following    
      if(!template) {
        template = '{{Line1}}, {{Line2 ? Line2   ', ' : ''}}{{City}} {{State}} {{Zip}}';
      }

      try {
        var parsedTemplate = $interpolate(template);
      } catch (e) {
        console.log(parsedTemplate, template, input, e)
        return input;
      }

      // Compile the template in the context of the input object
      return parsedTemplate(input);
    };
  });

В Angular 1.2 это работает нормально. Однако в Angular 1.0 он завершается ошибкой с ошибкой, Error: Lexer Error: Unexpected next character at columns 6-6 [?] in expression [Line2 ? Line2 ', ' : '']. я думаю, что Angular 1.0 не поддерживает выражения тернарного оператора $interpolate , но я не смог найти никакой документации, предполагающей, что поддержка была добавлена в Angular 1.2.

Есть ли способ использовать тернарный оператор в Angular 1.0, и если нет, то как я могу обойти это ограничение?

(Бонусные баллы — где в документации упоминается это изменение или какой коммит в репозитории Angular git внес изменения?)

Комментарии:

1. Я думаю, что нашел фиксацию в другом сообщении StackOverflow, в котором добавлен троичный оператор в Angular 1.1.5 (фиксация 6798fec )

2. Альтернативой использованию троичного оператора является: someCondition amp;amp; DoTruthy || DoFalsey

3. @Ian Я считаю, что это ответ на вопрос; может быть, вам следует написать это как ответ вместо комментария?

4. Согласно списку изменений , поддержка троичного оператора действительно была добавлена в версии 1.1.5 triangle-squarification (2013-05-22) : » $parse : добавить поддержку троичных операторов в parser ( 6798fec4 )» Итак, это коммит: 6798fec4 .

Ответ №1:

Я понял, что до обновления до 1.1.5 мой обходной путь к использованию троичного оператора в интерполированных выражениях заключался в использовании amp;amp; и || (like someCondition amp;amp; TruthyResult || FalseyResult ) для эффективного получения того же результата. Вот как вы могли бы применить это к своему коду:

 template = '{{Line1}}, {{Line2 amp;amp; (Line2   ', ') || ''}}{{City}} {{State}} {{Zip}}';

ДЕМОНСТРАЦИЯ: http://jsfiddle.net/f9n6r /

Единственная проблема с этой настройкой заключается в том, что если TruthyResult на самом деле не возвращает что-то правдивое, то FalseyResult будет возвращено amp;amp; (просто характер использования || и, как это, по сравнению с троичным оператором). Однако в вашем коде (Line2 ', ') никогда не будет falsey из-за ', ' , так что здесь это не будет проблемой. Но в более общем случае это может быть.