ExpressJS res.render不使用angularjs

时间:2015-03-01 00:10:07

标签: javascript angularjs node.js express angularjs-routing

我是Node.js,Express和angularjs的新手。我正在开发一个简单的登录功能,如果成功登录,将重定向到另一个页面。我知道我可以使用window.location来实现重定向目的,但我正在尝试使用res.render,因为我还想将一些值传递给新页面。

然而,res.render似乎不起作用,结果页面永远不会出现。

Signin.ejs:

<div id="navbar" class="navbar-collapse collapse" ng-controller="signinController">
      <form class="navbar-form navbar-right">
        <div class="form-group">
          <input type="email" ng-model="inputEmail" placeholder="Email" class="form-control">
        </div>
        <div class="form-group">
          <input type="password" ng-model="inputPassword" placeholder="Password" class="form-control">
        </div>
        <button type="submit" ng-click="signIn()" class="btn btn-success">Sign in</button>
      </form>
</div>

嵌入的javascript是:

function signinController($scope,$http,$location) {

    $scope.signIn = function() {
        $http({
            method: 'POST',
            url: '/signin',
            data: { "inputEmail": $scope.inputEmail, "inputPassword": $scope.inputPassword }

         });
    };
}

app.js

app.get('/result', home.result);
app.post('/signin', home.afterSignIn);

home.js

    function afterSignIn(req,res)
{
    // check user already exists
    var sqlStr="select * from users where email='"+req.param("inputEmail")+"' and password='"+req.param("inputPassword")+"'";
console.log("Query is:"+sqlStr);
res.render('result', { result: 'sqlStr' });
}

exports.result=function(req,res){
    res.render('result');
}
exports.afterSignIn = afterSignIn;

result.ejs

<%= result %>

非常感谢任何建议或工作示例:)

1 个答案:

答案 0 :(得分:0)

我觉得你有点困惑。在路由方面,使用express作为 REST 引擎。 Angular routes 将负责显示逻辑并在客户端查看路由。

我建议你将JSON数据传递给前端角度,然后让它为你完成工作。例如:

app.get('/', function (req, res) {
  res.json({
    title : "n562d", 
    strapline : "Please Log In"
  })
});

您可以在端点访问API:http://localhost:3000/使用$resource服务访问快速端点。

示例:

var MyResource = $resource('/');
 var myResource = new MyResource();
 myResource.$get(function(result){
   //result holds -->{title : "n562d", strapline : "Please Log In"}
   //use $location to change the uri, which is handled by Angular route config
   $location.path('/') 
 });

对于角度路由,我建议您使用ui-router

示例:

function($stateProvider,$urlRouterProvider){
    $urlRouterProvider.otherwise("/");

     $stateProvider
     .state('index', {
      url: "/",
      templateUrl: 'app/authorization/index.tpl.html',
      controller: 'AuthController'
    })
     .state('login', {
      url: "/login/",
      templateUrl: 'app/authorization/login.tpl.html',
      controller: 'AuthController'
    })
    .state('signup',{
      url: "/signup/",
      templateUrl : 'app/authorization/signup.tpl.html',
      controller: 'AuthController'
    });
}
]);

如果您需要更详细的答案,请告诉我,然后我会更新它。我希望它有所帮助。

随意寻找类似的实现here