Heim > Web-Frontend > js-Tutorial > Hauptteil

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

黄舟
Freigeben: 2017-05-27 10:35:14
Original
1222 Leute haben es durchsucht

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";
});
Nach dem Login kopieren

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>
Nach dem Login kopieren


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


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

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 hier

  • user
  • . 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;
    });
    Nach dem Login kopieren

    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.

    {{params.age}}

    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!

    Verwandte Etiketten:
    Quelle:php.cn
    Erklärung dieser Website
    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
    Beliebte Tutorials
    Mehr>
    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage