javascript - Problème de double accolade {{}} dans Angular.js

Question

<p ng-controller="listCtrl">
    <h1>这是列表页面</h1>
    <ul>
        <li ng-repeat="item in myList"><a href="#/myDetail/{{$index}}">{{item}}</a></li>
        <li ng-repeat="item in myList"><button ng-click="jump('/myDetail/'+$index)">{{item}}</button></li>
    </ul>

</p>

Comme le titre l'indique, dans le code ci-dessus, je dois obtenir la valeur $index en tant que paramètre Dans le premier li, je dois ajouter {{}} pour obtenir la valeur, mais dans le second li, je ne le fais pas. pas besoin de l'ajouter ; comment distinguer cela ? ?

Answer 1

Pour analyser les données en HTML natif, vous devez utiliser {{}} pour lier les données, mais cela n'est pas nécessaire derrière la commande ng.

Answer 2

{{ $var }}包裹的模板变量，当需要直接输出变量值，而无需额外解析（如过滤器处理、作为指令参数、作为函数参数）时使用，反之，ng-click="jump('/myDetail/'+ $index)" est le paramètre appelé dans la commande.

Answer 3

Le critère simple est

• Si le type attribué à l'attribut actuel est un type littéral, tel qu'un attribut dans un modèle HTML, ou un attribut avec @ comme modificateur dans une directive, alors si des doubles accolades ne sont pas ajoutées lors de l'attribution de la valeur, cela sera calculé comme un littéral Oui, si vous souhaitez l'analyser comme une variable, vous devez ajouter des doubles accolades.

• Si le type attribué à l'attribut actuel est un type non-chaîne, tel que diverses instructions intégrées dans le modèle angulaire, ou des attributs modifiés avec <、=、& dans les instructions, alors l'affectation sera analysée selon les règles de syntaxe de js. Dans ce cas, pas besoin d'ajouter des accolades.

Answer 4

Expliquez d'abord les deux types dans Angular :

Modèle : Le format est {{...}}，实质是字符串，会被解析引擎展开成可以识别的字符串文本
表达式：可以直接运行的代码，和JS写法基本一致，只是省略了所有的this.

Ensuite, vous pouvez vous référer au contexte pour déterminer si vous écrivez une partie de type JS ou une chaîne littérale, afin qu'il soit facile de juger si vous avez besoin d'un modèle ou d'une expression.