我的AngularJS表达式没有'不起作用

My AngularJS expressions don't work

本文关键字：不起作用 AngularJS 表达式 我的      更新时间：2023-09-26

我最近开始学习AngularJS，但遇到了一些问题。我试着在WebMatrix 3中使用代码语言，指令也能正常工作，但表达式在网页中显示得不好。在代码中，我键入：

<p>{{ title }}</p>

然后在网页中，它将显示：｛｛title｝｝，而不是我编程的标题。

这是我的其余代码。

index.html:

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
</head>
<body data-ng-app="myApp">
<div data-ng-controller="MainController">
<p>{{ title }}</p>
{{ 5 + 5 }}
</div>
</body>
</html>

MainController.js:

app.controller('MainController', ['$scope', function ($scope) {
    $scope.title = 'Top Sellers in Books';
} ]);

app.js:

var app = angular.module("myApp", []);

那么有人知道为什么表达式不会显示我的数据吗？我用{｛5+5｝}之类的东西尝试过，但仍然没有成功。任何帮助都将不胜感激。谢谢

根据我的评论，您显然没有包含script标记来引用包含应用程序模块初始化和控制器代码的文件，这就是为什么您的表达式不起作用。

你应该把这个脚本放在你的头部有棱角的脚本下面。

<head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
    <script src="fileContainingYourControllerScript.js"></script>
</head>

重构的好处：一旦你开始工作，就进行一些重构，将所有脚本从标题中移出，放在HTML的底部，在HTML文档的结束标记之前。它将提高页面加载性能。您还可以考虑使用Bower来管理您的依赖关系（Angular等）。

相关文章：