在HTML中以纯文本形式呈现AngularJS
在HTML中以纯文本形式呈现AngularJS
提问于 2014-06-17 07:23:36
我正在学习代码学校的AngularJS教程，但我的JavaScript无法呈现到HTML语言中。
这是HTML
<html ng-controller="StoreController as store">
<head>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
</head>
<body>
<div>
<h1> {{store.product.name}} </h1>
<h2> $ {{store.product.price}} </h2>
<p> {{store.product.description}} </p>
</div>
<script type="text/javascript" src="js/angular.min.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</body>
</html> 这是一个角度
(function(){
var app = angular.module("store", []);
app.controller('StoreController',function(){
this.product = gem;
});
var gem = {
name: 'Dodecahedron',
price: 2.95,
description:"..."
};
})();角度只是呈现为纯文本
回答 1
Stack Overflow用户
发布于 2014-06-17 07:31:14
顶部缺少ngApp。
<html data-ng-app="store">
<head>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
</head>
<body>
<div ng-controller="StoreController as storeCtrl">
<h1> {{storeCtrl.product.name}} </h1>
<h2> $ {{storeCtrl.product.price}} </h2>
<p> {{storeCtrl.product.description}} </p>
</div>
<script type="text/javascript" src="js/angular.min.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</body>
</html>你的gem变量是由angular使用的，在它实际定义之前。
(function(){
var app = angular.module("store", []);
var gem = {
name: 'Dodecahedron',
price: 2.95,
description:"..."
};
app.controller('StoreController',function(){
this.product = gem;
});
)();我建议将script标记移到顶部，因为这样做可以让html呈现得更快，但这会导致在angular应用程序中显示丑陋的占位符几毫秒。
将-Ctrl后缀附加到控制器视图变量，这将清楚地表明，当您执行所有访问控制器或它只是一个作用域变量时。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/24257952
复制相关文章
![[答疑]在向用户提供服务之前，某些服务需要用户所在部门的审批](https://ask.qcloudimg.com/http-save/yehe-6288414/d8df9debd5028684165189e23d6b2115.jpeg)
![webservice框架jersey简单总结[通俗易懂]](https://ask.qcloudimg.com/http-save/yehe-8223537/61c6696e88df7974b048de6864bae38e.jpg)
点击加载更多
相似问题
Rmarkdown、bookdown、texreg和交叉引用
变量在rmarkdown中作为标题
在使用Word时，如何去掉“标题”的前导点？
使用带有RStudio/rmarkdown/knitr的texreg包创建模型汇总表
为什么在尝试渲染Rmarkdown pdf文档时，`texreg`参数`scalebox`现在会抛出错误？
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
