Question

我在离子应用程序视图中有以下代码：

<ion-item 
    ng-repeat="milestone in project.milestones" 
    href="#/tab/activity/{{milestone.slug}}/milestone" 
    ng-style="{{now | amDifference : null : 'days'}} > {{milestone.due_date | amDifference : null : 'days'}} && {'color':'red'} || {'color': 'blue'}">

然而它给了我这个错误：

错误：[$ parse：syntax]语法错误：令牌'＆amp;＆amp;'不是表达式[0]的第6列的主要表达式。＆安培;＆安培; {'color'：'red'} || {'color'：'blue'}]从[＆amp;＆amp; {'color'：'red'} || {'color'：'blue'}]。

Hovever上面的错误似乎并没有影响执行（现在我觉得）我不知道它来自哪里。在上面的代码中，我试图使用moment.js

将当前时间与设定时间进行比较

Answer 1

ng-style属性中的表达式没有意义：

{{now | amDifference : null : 'days'}} > {{milestone.due_date | amDifference : null : 'days'}} && {'color':'red'} || {'color': 'blue'}

它应该是单个对象文字，或者是一个评估为1的角度表达式。

＆＃39;＆gt;＆＃39;的左侧你有一些内容包含在{{＆＃39;。这在角度表达式中无效。只使用＆＃39; {{＆＃39;在一个没有采取角度表达的地方替换。我认为你已经这样做了，因为你想对值使用过滤器，但在这样的情况下这并不容易，因为你必须将过滤器暴露在范围内。

尽可能接近我正试图做这样的事情：

$scope.itemStyle = function itemStyle(now, milestone) {
    if (amDifferenceFilter(now, null, 'days') > amDifferenceFilter(milestone.due_date, null, 'days')) {
        return { color: 'red' }
    } else {
        return { color: 'blue' }
    }
}

如果您还没有这样做，您还需要将amDifferenceFilter注入您的控制器，或者直接从javascript代码中使用moment.js。

然后你的html应该是：

<ion-item ng-repeat="milestone in project.milestones"
  href="#/tab/activity/{{milestone.slug}}/milestone"
  ng-style="itemStyle(now,milestone)">

在ng-style中编写复杂的表达式可能会令人困惑，通常最好将它们拉出到控制器中。

Answer 2

你错过了“ng-style之后。

语法错误：令牌'＆amp;＆amp;'不是主要表达

2 个答案: