javascript - Angular获取语法错误: Token ':' is an unexpected token while accessing URLs from JSON

Question

我有以下 json，我正在从中提取 tweeturl

{
  "name": "Lifehacker",
  "handle": "@lifehacker",
  "avatar": "images/lifehacker.png",
  "time": "1h",
  "tweet": "Workflow, the nifty automation app on iOS, just got a heck of a lot easier to use: ",
  "attachments": {
    "media": "image",
    "url": "images/twitter.jpg"
  },
  "tweeturl": "http://lifehac.kr/L18xlfM",
  "interaction": {
    "like": "2m",
    "retweet": "5k"
  }
}

并像这样显示它:

<a href="{{tweets.tweeturl}}" ng-show="{{tweets.tweeturl}}">{{tweets.tweeturl}}</a>

但每次执行时我都会得到 URL，但也会在控制台上收到错误消息

语法错误:标记“:”是从 [://lifehac.kr/L18xlfM] 开始的表达式 [http://lifehac.kr/L18xlfM] 第 5 列中的意外标记。

我对 Angular 还很陌生，任何帮助和解释将不胜感激

Answer 1

ng-show 需要一个表达式(例如，在范围变量中定义的名称，其计算结果为 truthy 或 假值)，而不是字符串。

您不必使用 {{ }} 语法对其进行插值。直接传递变量即可:

<a href="{{tweets.tweeturl}}" ng-show="tweets.tweeturl">{{tweets.tweeturl}}</a>

当您编写 ng-show="{{tweets.tweeturl}}" 时，发生的情况是 Angular 首先将 {{tweets.tweeturl}} 插入到 http://lifehac.kr/L18xlfM - 然后它尝试将其视为一个表达式，所以就像您尝试编写这样的 JavaScript:

function someFunction () {
   var abc = '123';
   http://lifehac.kr/L18xlfM    // <- this is not a correct expression
   return abc;
}