Angular在通过NodeJS服务器提供服务时不更新html模板variables
这是一个具体的问题，但是我有一个答案。
首先，有一点背景。 我一直在试图学习angular度，我想开始使用节点作为后端。 我目前有一个工作的教程应用程序，我可以在本地运行，只是返回硬编码到主控制器的数据。
当我把文件移动到我的NodeJS服务器，但它停止工作。 这是什么工作：
- 文件加载正确 – 没有控制台错误，我可以查看源文件中的每个文件（index.html，app.js，maincontroller.js）
- 范围存在，variables被定义。 我把一个console.log（$范围）在mainController.js文件中，我可以看到所有正确定义的variables。
- 非angular度的JavaScript的作品 – 我可以放置在mainController外/警报，他们都正常工作（也console.log显然工程）
我通过一个简单的Node.js服务器来提供这些文件。 我正在使用快递和hbs。 我最初使用的是压缩和0高速caching的长度，但从那以后删除了那些没有改变的结果。
我遇到的具体问题是没有模板variables更新。 我简化了下面的代码进行testing。 在本地查看时，页面显示“我现在了解范围的工作原理！”，当从Cloud 9提供时，该结构存在，但模板中的{{understand}}variables不起作用。
的index.html
<!DOCTYPE html> <head> <title>Learning AngularJS</title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script> <script src="js/app.js"></script> <script src="js/maincontroller.js"></script> </head> <body> <div id="content" ng-app="MyTutorialApp" ng-controller="MainController"> {{understand}} </div> </body> app.js
var app = angular.module('MyTutorialApp',[]);
maincontroller.js
app.controller("MainController", function($scope){ $scope.understand = "I now understand how the scope works!"; });
server.js（Cloud 9上的节点服务器）
var express = require('express'); var app = express(); var hbs = require('hbs'); app.set('view engine','html'); app.engine('html',hbs.__express); app.configure(function() { app.set('views', __dirname); }); //app.use(express.compress()); app.use('/js',express.static(__dirname + '/client/js')); app.use('/css',express.static(__dirname + '/client/css')); app.use('/img',express.static(__dirname + '/client/img')); //router app.get('/',function(req,res){ res.render('client/index.html'); return; }); //404 responses app.use(function(req, res, next){ res.status(404); // respond with html page if (req.accepts('html')) { res.render('client/404.html', { url: req.url }); return; } // respond with json if (req.accepts('json')) { res.send({ error: 'Not found' }); return; } // default to plain-text. send() res.type('txt').send('Not found'); }); app.listen(process.env.PORT); console.log('listening on port '+process.env.PORT);
当我读书时，每一个事物都变得清晰
"Handlebars.js is an extension to the Mustache templating language"
这个菜单是什么，hbs使用{{}}作为分隔符以及angular，所以在你的html {{谅解}}永远不会得到的angular度，因为是首先分析，并由HBBS取代。 如果你想使用hbs和angular度你需要改变你的分隔符使用你的angulars $ interpolateProvider在你的应用程序configuration
$interpolateProvider.startSymbol('{/{'); $interpolateProvider.endSymbol('}/}');
你可以使用\{{understand}}因为这样会抵消你的hbs，并把你的angular度放在最前面。