初学者 Angular JS 应用程序,插值不起作用
Posted
技术标签:
【中文标题】初学者 Angular JS 应用程序,插值不起作用【英文标题】:Beginner Angular JS app, interpolation not working 【发布时间】:2016-11-17 10:38:38 【问题描述】:我刚开始使用 Angular JS(版本 1),但无法正确运行插值。我已经用已解决的版本检查了它,对我来说看起来不错。我什至在控制器中放置了一个 console.log 并且它不打印任何东西。请帮忙。
index.html
<!doctype html>
<html lang="en" np-app="LunchCheck">
<head>
<meta charset="utf-8">
<script src="angular.min.js"></script>
<script src="app.js"></script>
<title>Lunch Checker</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="styles/bootstrap.min.css">
<style>
.message font-size: 1.3em; font-weight: bold;
</style>
</head>
<body>
<div class="container" ng-controller="LunchCheckController">
<h1>Lunch Checker</h1>
<div class="form-group">
<input id="lunch-menu" type="text"
placeholder="list comma separated dishes you usually have for lunch"
class="form-control" ng-model="food">
Content is: food
</div>
</div>
</body>
</html>
app.js
(function()
'use strict';
angular.module('LunchCheck', [])
.controller('LunchCheckController', LunchCheckController);
LunchCheckController.$inject = ['$scope'];
function LunchCheckController($scope)
console.log("In controller");
$scope.food = 'Enter something';
)();
【问题讨论】:
你写的是 np-app="LunchCheck" 而不是 ng-app 【参考方案1】:用 ng-app 替换 np-app 就可以了
【讨论】:
【参考方案2】:你写的是 np-app 而不是 ng-app
<html lang="en" np-app="LunchCheck">
【讨论】:
以上是关于初学者 Angular JS 应用程序,插值不起作用的主要内容,如果未能解决你的问题,请参考以下文章
2017年前端开发Angular.JS从入门到上手企业开发视频
使用 Angular.js 和 Node.js 构建实时应用程序的更好方法是啥?