使用 EJS 渲染 html 文件，其中包含 angular

Question

我有一个节点 + angular 项目。我想渲染一个 html 页面并用一些值初始化它。我希望将这些值链接到 Angular 范围。

所以我有一个输入，我将它与 ng-model 链接，但这会删除 EJS 初始化。

server.js:

var express = require('express');
var app = express();
app.engine('html', require('ejs').renderFile);
app.set('views', __dirname + '/front/views');
app.set('view engine', 'html');
app.use('/front',express.static(__dirname + '/front'));

app.get('/signup',function(req,res){
    res.render('view',{
        user:{
            email:"user mail",
        }
    })
});
var port = 5000;
app.listen(port, function() {
    console.log("Listening on " + port);
});

view.html:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>

<script src="/front/controllers/app.js"></script>

<html ng-app="onboardingApp">

    <form id="msform" novalidate ng-controller="onboardingController">

        <input required  type="text" name="email" ng-model="signup.user.email">
        <label for="email">Email</label>

        <input type="button" name="next" ng-click="displaySignup()" value="NEXT"/>

    </form>

</html>

app.js:

var onboardingApp = angular.module('onboardingApp', []);

onboardingApp.controller('onboardingController',function OnboardingController($scope) {

    $scope.signup = {
        user:{
            email:""
        }
    }

    $scope.displaySignup = function(){
        console.log($scope.signup)
    }

});

所以我试图设置值：input required type="text" name="email" ng-model="signup.user.email"

with ejs 然后将此值与 angular 模型链接 signup.user.email.

有人可以帮我吗？

Answer 1

你可以在你的view.html

末尾加上这段js

<script type="text/javascript">
      angular.module('onboardingApp')
        .value('userEmail', <%- JSON.stringify(user.email) %>);
</script>

然后像这样在任何需要的地方注入组件：

onboardingApp.controller('onboardingController',
 function OnboardingController($scope, userEmail) {

    $scope.signup = {
        user:{
            email: userEmail
        }
    }

    $scope.displaySignup = function(){
        console.log($scope.signup)
    }

});

使用 EJS 渲染 html 文件，其中包含 angular

Render html files with EJS with angular in it

html

javascript

ejs

node.js

angularjs