简体   繁体   中英

AngularJS Hello World does not work

I'm getting started with AngularJS and surprisingly this super simple piece of code is not working. This page is served by expressJS with the hogan render engine.

The console doesn't say anything and my file paths are all correct and double checked. Still this simple data-binding does not work. Please help.

<!doctype html>
<html lang="en" >
<head>
    <meta charset="UTF-8">
    <title>Login</title>
    <link rel="stylesheet" href="../css/style.css">
    <script src="../js/angular.min.js"></script>
    <script src="../js/angular-route.min.js"></script>
    <script src="../js/angular-cookies.min.js"></script>
    <script src="../js/angular-resource.min.js"></script>
    <script src="../js/angular-animate.min.js"></script>
</head>
<body>

    <div ng-app>
        <input type="text" ng-model="unm">
        <h2>Hello {{unm}}</h2>
    </div>


</body>
</html>

Problem solved. As I mentioned, I'm using the Hogan render engine in Express which has the same template brackets {{ }} as AngularJS. Hence when the page is rendered, Hogan strips all {{ }} thereby virtually removing the {{unm}}.

I've solved this problem by adding this line to my ExpressJS app :

app.locals.delimiters = '{{{ }}}';

Now, Hogan variables can be put inside {{{somevariable}}} while Angular works with its usual {{unm}}. They no longer conflict now.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM