Heim  >  Artikel  >  Web-Frontend  >  AngularJS-Erste-Schritte-Tutorial (2) – Einführung in die Übergabe von Parametern beim Routing

AngularJS-Erste-Schritte-Tutorial (2) – Einführung in die Übergabe von Parametern beim Routing

黄舟
黄舟Original
2017-05-27 10:35:141184Durchsuche

In diesem Artikel wird hauptsächlich die Methode zur Übergabe von AngularJS-Parametern beim Routing vorgestellt. Er analysiert die zugehörigen Fähigkeiten von AngularJS bei der Implementierung von Routing-Parametern und fasst die relevanten Betriebsschritte und Vorsichtsmaßnahmen zusammen.

Das Beispiel in diesem Artikel beschreibt, wie AngularJS Parameter beim Routing übergibt. Teilen Sie es allen als Referenz mit. Die Details lauten wie folgt:

Wir können nicht nur den Wert des Attributs direkt im Controller definieren, wie zum Beispiel:


app.controller('listController',function($scope){
  $scope.name="ROSE";
});

AngularJS bietet auch die Funktion zum Übergeben von Parametern. Eine Möglichkeit, die mir derzeit begegnet ist, besteht darin, Parameter aus der Ansicht zu übergeben:


<!--首页html-->
<li><a href="#/user/18" rel="external nofollow" rel="external nofollow" >用户</a></li>


//js
.config([&#39;$routeProvider&#39;, function($routeProvider){
    $routeProvider.
    when(&#39;/user/:age&#39;,{
        templateUrl:&#39;list.html&#39;,
        controller:&#39;listController&#39;})
 }]);


<!--list.html-->
<p>
  <p>
  <h1>HI,这里是list.html</h1>
  <h2>{{name}}</h2>
  <h3>{{params.age}}</h3>
</p>
</p>

AngularJs bietet eine Möglichkeit, „18“ von der Homepage-Ansicht an die list.html-Ansicht zu übergeben. Das heißt, der eigentliche Parameter wird nach der View-Routing-Adresse eingefügt. Wie hier25edfb22a4f469ecb59f1190150159c6f3070c630e05965d2637a2d3f8fe3ef6user5db79b134e9f6b82c0b36e0489ee08edbed06894275b65c1ab86501b08a632eb. Deklarieren Sie dann die Variable in der when-Methode von JS so, dass sie mit dem tatsächlichen Parameter übereinstimmt. Aber der eigentliche Parameter wird in $routeParams (Array) als „Schlüsselwert“ gespeichert, und wir müssen ihn in das Steuersymbol einfügen (die sogenannte Injektion bedeutet eigentlich, alle darin enthaltenen Attribute und Werte zu teilen?) . Dann deklarieren und weisen Sie den Wert im Controller zu (d. h. nehmen Sie ihn heraus). Wie folgt:


.controller(&#39;listController&#39;,function($scope,$routeParams){
  $scope.name="ROSE";
  $scope.params=$routeParams;
});

Die Zusammenfassung der Parameterübergabeschritte lautet wie folgt:

1 das „/“ der Startseitenansicht. Fügen Sie die tatsächlichen Parameter hinzu, die später übergeben werden sollen.
2. Definieren Sie eine Variable im Routing-Pfad in der Routing-Konfiguration für den Abgleich im Format /:variable.
3. Konfigurieren Sie den Controller und fügen Sie $routeParams in den Controller ein.
4. Werte im Controller zuweisen. $scope.params=$routeParams;
5. Der tatsächliche Parameter wird nach Abschluss des Routings erfolgreich in der Ansicht angezeigt. 684271ed9684bde649abda8831d4d355{{params.age}}39528cedfa926ea0c01e69ef5b2ea9b0

Zu beachten ist, dass der tatsächliche Parameter in $routeParams als Schlüsselwert gespeichert ist und über The aufgerufen werden muss Um diesen Wert zu erhalten, kann die entsprechende Variable (in diesem Fall das Alter) verwendet werden.

Das obige ist der detaillierte Inhalt vonAngularJS-Erste-Schritte-Tutorial (2) – Einführung in die Übergabe von Parametern beim Routing. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn