問(wèn)題描述

<p ng-controller='listCtrl'> <h1>這是列表頁(yè)面</h1> <ul><li ng-repeat='item in myList'><a href='http://www.leifengta.com.cn/wenda/13666.html#/myDetail/{{$index}}'>{{item}}</a></li><li ng-repeat='item in myList'><button ng-click='jump(’/myDetail/’+$index)'>{{item}}</button></li> </ul></p>

如題，如上的代碼中，我需要取到$index值作為參數(shù),在第一個(gè)li中需要加{{}}才能取到值，而第二個(gè)li中不需要加；這個(gè)該如何區(qū)分？？

問(wèn)題解答

在原生html里面為了解析數(shù)據(jù)，需要使用{{}}來(lái)綁定數(shù)據(jù)，而ng的命令后面沒(méi)有這需要。

{{ $var }}包裹的模板變量，當(dāng)需要直接輸出變量值，而無(wú)需額外解析（如過(guò)濾器處理、作為指令參數(shù)、作為函數(shù)參數(shù)）時(shí)使用，反之，ng-click='jump(’/myDetail/’+ $index)' 是在指令中調(diào)用的參數(shù)。

簡(jiǎn)單的判定標(biāo)準(zhǔn)就是

如果當(dāng)前屬性所賦值的類(lèi)型為字面量類(lèi)型，比如html模板中的屬性，或者指令中以@為修飾符的屬性，那么賦值的時(shí)候如果不加雙花括號(hào)，均是按字面量來(lái)算的，想要按變量的方式解析，就需要加雙花括號(hào)。

如果當(dāng)前屬性所賦值的類(lèi)型是非字符串類(lèi)型，比如angular模板中的各種內(nèi)置指令，或者指令中以<、=、&修飾的屬性，那么賦值的時(shí)候會(huì)按js的語(yǔ)法規(guī)則進(jìn)行解析，這種情況就不需要加花括號(hào)了。

先說(shuō)明下Angular中的兩種類(lèi)型：

模板：格式為{{...}}，實(shí)質(zhì)是字符串，會(huì)被解析引擎展開(kāi)成可以識(shí)別的字符串文本表達(dá)式：可以直接運(yùn)行的代碼，和JS寫(xiě)法基本一致，只是省略了所有的this。

然后你可以參照一下上下文，確定你現(xiàn)在是在寫(xiě)類(lèi)似JS的部分，還是在寫(xiě)一個(gè)字符串文本，這樣就容易判斷你是需要模板還是表達(dá)式了。