Question

我正在编写一个过滤器来在一行中格式化地址。将传递给过滤器的对象具有以下格式：

{
  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 d表达式，但我找不到任何文档表明在Angular中添加了支持1.2。

有没有办法在Angular 1.0中使用三元运算符，如果没有，我怎么能绕过这个限制？

（加分点 - 在文档中它提到了这个更改，或Angular git repo中的哪些提交进行了更改？）

Answer 1

我意识到在升级到1.1.5之前，我在插值表达式中使用三元运算符的解决方法是使用&&和||（如someCondition && TruthyResult || FalseyResult）来有效地获取同样的结果。以下是将其应用于代码的方法：

template = '{{Line1}}, {{Line2 && (Line2 + \', \') || \'\'}}{{City}} {{State}} {{Zip}}';

DEMO： http://jsfiddle.net/f9n6r/

此设置的唯一问题是，如果TruthyResult实际上没有返回真实的内容，则会返回FalseyResult（仅使用&&和{{1的性质像这样，与三元运算符相比）。但是，在您的代码中，由于||，(Line2 + \', \')永远不会是假的，所以这里不会有问题。但在更一般的情况下，它可能是。

AngularJS 1.0和1.2之间$ interpo的差异

1 个答案: