AngularJS Getting Started Tutorial (2) - Introduction to how to pass parameters in routing

This article mainly introduces the method of AngularJS passing parameters in routing. It analyzes the related skills of AngularJS in implementing routing parameters in the form of examples, and summarizes the relevant operation steps and precautions. Friends in need can refer to the following

The example in this article describes how AngularJS passes parameters in routing. Share it with everyone for your reference, the details are as follows:

Not only can we directly define the value of the attribute in the controller, such as:

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

AngularJS also provides In addition to the function of passing parameters, one way I am currently exposed to is to pass parameters from the view:

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

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

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

AngularJs provides a way to pass "18" to the list.html view in the homepage view. That is to put the actual parameter after the view routing address. Such as here

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

Summarize the steps of passing parameters as follows:

1. Add after "/" in the home page view The actual parameters to be passed.
2. Define a variable in the routing path in the routing configuration for matching, in the format /:varible.
3. Configure the controller and inject $routeParams into the controller.
4. Assign values ​​in the controller. $scope.params=$routeParams; .
5. The actual parameter is successfully displayed in the view after routing is completed.

{{params.age}}

One thing to note is that the actual parameter is stored as a key value in $routeParams , the value must be obtained by accessing its corresponding variable (age in this case).

The above is the detailed content of AngularJS Getting Started Tutorial (2) - Introduction to how to pass parameters in routing. For more information, please follow other related articles on the PHP Chinese website!