Angular技术疑问：视图中变量何时需放入双大括号{{}}

这个问题问得很关键，其实核心是搞清楚AngularJS的表达式解析逻辑和原生HTML属性的行为差异，咱们结合你给出的例子来拆解说明：

核心判断规则 #

• Angular自带指令（ng-前缀）的属性值：直接写表达式，不用{{}}
  像ng-show、ng-if、ng-click这类内置指令，它们的属性本身就是为接收Angular表达式设计的。Angular会自动把属性值当成表达式去解析，直接关联$scope上的变量或逻辑判断。
  比如你的例子里ng-show="img"，Angular会直接检查$scope.img的值是否为“真”（这里img是一个非空字符串，属于真值，所以图片会显示），完全不需要套双大括号。

• 原生HTML属性/模板文本内容：需要用{{}}做插值绑定
  对于原生的src、href、title这些HTML属性，浏览器会在Angular初始化完成前就尝试解析它们。如果直接写src="{{img}}"，浏览器会先发起一个指向{{img}}的无效请求，这也是Angular提供ng-src、ng-href这类替代指令的原因。
  不过ng-src这类指令其实兼容两种写法：{{img}}（插值）和直接写img（表达式），本质都是绑定$scope.img的值。你例子里用{{img}}是很常见的写法，和ng-src="img"效果完全一致，只是个人习惯问题。

  另外，如果你要在标签的文本内容里显示变量，必须用{{}}，比如：

  <p>当前图片地址：{{img}}</p>
  

补充几个直观示例 #

• ✅ 正确：<button ng-click="toggleImage()">切换显示</button>（ng-click直接接收表达式）
• ✅ 正确：<img ng-src="img" ng-show="img">（和你的例子功能完全相同）
• ❌ 错误：<img src="{{img}}">（浏览器会提前请求无效地址）
• ✅ 正确：<div ng-class="{active: isActive}">高亮区块</div>（ng-class接收对象表达式）

简单总结：Angular指令的属性直接用表达式，原生属性/文本内容用插值{{}}，这样就不会再搞混啦~

内容的提问来源于stack exchange，提问作者Moaaz Bhnas