Question

节点JS：

var toSend = [ 
    {"id":1, "topic":"Topic1", "name": "Name1"},
    {"id":2, "topic":"Topic2", "name": "Name2"}
    ]


app.get('/topics', function(req, res){
    return res.json(toSend);
    });
});


app.get('/newpage/id/:id', function(req, res){
    var theid = req.params.id;
    return res.json(theid);
});

在我的index.html页面中，我有以下内容：

<html ng-app="myApp">
<head>
<script src="angular.min.js"></script>
</head>
<body>
<div ng-controller="Ctrl1">

<ul>
  <li ng-repeat="topic in topics">
       <a ng-href="newpage/id={{topic.id}}"> {{topic.name}} </a>
  </li>
</ul>

</div>
<script src = "myapp.js"></script>
</body>
</html>

myapp.js：

var app = angular.module("myApp",[]);

app.controller("Ctrl1", function($scope, $http){
    $http.get( "/topics").success(function( data) {
        $scope.topics = data;
    });
});

app.controller("newpageCtrl", function($scope, $http){
    $http.get( "/newpage").success(function( data) {
        $scope.name= data;
    });
});

在newpage.html中：

//HTML same to index.html. The body is: 
<body>
    <div ng-controller="newpageCtrl">
        {{name}}
    </div>
</body>

在我点击index.html中的<li>之前，一切正常。我从未使用从Angular ng-href传递的id进入新页面。我想要实现的是在索引页面中显示li，当我点击任何链接时，带我到点击了id的新页面。我似乎无法从节点传递值。如果我使用express并定义视图，我可以使用<%= data.name %>传递值。但我想使用Angular的模板。

如何将Angular页面中的点击值传递给NodeJS并将页面重定向到另一个具有正确值的Angular页面？

感谢。

Answer 1

我有使用angular-ui-router解释的plunker代码。

可能您可以将它作为基础并在此基础上构建您的样本。＆＃39;

https://plnkr.co/edit/OfFwSA?p=info

(function(){

  'use strict';

  angular
  .module('plunker')
  .config(['$stateProvider', function($stateProvider)
  {
      $stateProvider
      .state('home', {
              url: '/', 
            templateUrl: 'home.html'      
            })
      .state('sports', {
      url: '/sports', 
      templateUrl: 'sports.html'      
      })    
        .state('sports.football', {
        url: '/football', 
        templateUrl: 'football.html'      
        })
        .state('sports.weightlifting', {
        url: '/weightlifting', 
        templateUrl: 'weightlifting.html'      
        })
        .state('sports.swimming', {
        url: '/swimming', 
        templateUrl: 'swimming.html'      
        })
      .state('country', {
      url: '/country', 
      templateUrl: 'country.html'      
      });

  }])
  .controller('testCtrl',function(){

  });

})();

在您的Html上：

<body >
    <ul> 
       <li><a ui-sref="home">Home</a></li>
       <li><a ui-sref="sports">Sports</a></li>
       <li><a ui-sref="country">Country</a></li>
    </ul>
    <div ui-view></div>
</body>

具有Angular单击值的NodeJS路由重定向页面

1 个答案: