2013-12-11 13 views
6

Warum funktioniert das nicht:kann Winkelwert nicht in Anführungszeichen verwenden

<ul class="dropdown-menu"> 
    <li ng-repeat="choice in dropDownItems"> 
    <a class="btn" ng-click="mnuClick('{{choice}}')">{{choice}}</a> 
    </li> 
</ul> 

Aber das funktioniert:

<ul class="dropdown-menu"> 
    <li ng-repeat="choice in dropDownItems"> 
    <a class="btn" ng-click="mnuClick('xxx')">{{choice}}</a> 
    </li> 
</ul> 

Im oberen Beispiel die mnuClick() Routinen nie aufgerufen werden, aber in das untere Beispiel, tut es. Wenn ich ein Inspektionselement mache, sieht alles gut aus.

+0

in Ausdrücken Sie nicht doppelt geschweiften Klammern müssen. http://stackoverflow.com/questions/17878560/difference-between-double-and-single-curly-brace-in-angular-js. Es ist von SPEC –

Antwort

7

Es funktioniert nicht, weil die Art, wie Sie es getan haben, Sie sagen, dass Sie die Zeichenfolge der mnuClick-Funktion bereitstellen möchten.

Wenn Sie xxx angeben, ist dies tatsächlich richtig, daher benötigen Sie die Anführungszeichen hier.

Aber wenn {{choice}} verwenden, wollen Sie nicht THAT Zeichenfolge, aber Sie wollen, dass die Expression ausgewertet werden und das Ergebnis als Parameter (was wahrscheinlich ist ein String) - daher müssen Sie nicht die Anführungszeichen (und nicht einmal die geschweiften Klammern) hier.

So schreiben Sie einfach

<a class="btn" ng-click="mnuClick(choice)">{{choice}}</a> 

und du bist fein :-).

Um es kurz zu machen: In einem Fall behandeln Sie einen Ausdruck, der in eine Zeichenfolge aufgelöst wird, im anderen Fall behandeln Sie direkt eine Zeichenfolge. Daher brauchen Sie einmal keine Anführungszeichen, das andere Mal.

Wenn Sie nähere Informationen zu wollen, wenn geschweiften Klammern zu verwenden, und wenn nicht, überprüft this answer auf diese Frage: Difference between double and single curly brace in angular JS?

Hoffnung, das hilft.

PS: In dem Text Ihrer a Tag, Sie Notwendigkeit die doppelten geschweiften Klammern, wie Sie nicht in einem AngularJS gesteuerten Code-Block hier sind - daher müssen Sie es als verbindlich markieren, sonst ist es‘ d sei einfach Text innerhalb von HTML.

2

Der Wert von ng-click wird als Winkelausdruck interpretiert, so dass Sie nicht die geschweiften Klammern um "Auswahl" verwenden müssen. Schreiben Sie es einfach so:

<a class="btn" ng-click="mnuClick(choice)">{{choice}}</a> 
0

Funktioniert das nicht?

ng-click="mnuClick(choice)" 

ich auf jeden Fall etwas in diese Richtung viele Male getan haben, aber nicht über den Code zu überprüfen, um die Hand ...

Verwandte Themen