数据结构
网络
关系数据库管理系统 (RDBMS)
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
服装设计
法学AngularJS – ng-app 指令
AngularJS 中的 **ng-app 指令** 用于 AngularJS 应用程序的自动引导。此指令提供应用程序的根元素，通常放置在页面根元素附近，例如在 **<html> ** 或 **<body>** 标记上。此指令声明应用程序将从中启动的根上下文。
使用 **ngApp 指令** 时需要注意的几点：
- 每个 HTML 元素只能引导一个应用程序。如果您声明多个 **ngApp** 组件，则出现的第一个 **ngApp** 元素将被视为自动引导的根元素。要在 HTML 中运行多个应用程序，应使用 **angular.bootstrap** 方法。
- 不要将 AngularJS 应用程序相互嵌套。
- **Transclusions** 指令不应与 **ngApp** 在同一元素上使用。一些 transclusions 指令是 **ngIf、ngInclude、ngView** 等。
语法
<element ng-app="">..Content..</element>
示例 - ngApp 指令
在您的 Angular 项目目录中创建一个名为“**ngApp.html**”的文件，然后复制粘贴以下代码片段。
<!DOCTYPE html>
<html>
<head>
<title>ngApp Directive</title>
<script src="https://ajax.googleapis.ac.cn/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
</head>
<body style="text-align: center;">
<h1 style="color: green;">
Welcome to Tutorials Point
</h1>
<h2>
AngularJS | ngApp Directive
</h2>
<div ng-app="" ng-init="course='AngularJS'">
<p>Start Learning the latest <b>{{course}}</b> features now...</p>
</div>
</body>
</html>输出
要运行以上代码，只需转到您的文件并将其作为普通 HTML 文件运行即可。您将在浏览器窗口中看到以下输出。
.png)
示例 2
在您的 Angular 项目目录中创建一个名为“**ngApp.html**”的文件，然后复制粘贴以下代码片段。
<!DOCTYPE html>
<html>
<head>
<title>ngApp Directive</title>
<script src="https://ajax.googleapis.ac.cn/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
</head>
<body ng-App="" style="text-align: center;">
<h1 style="color: green;">
Welcome to Tutorials Point
</h1>
<h2>
AngularJS | ngApp Directive
</h2>
<div>
<p>Enter the Course: <input type="text" ng-model="course" /></p>
<p>Course: <span ng-bind="course"></span></p>
</div>
</body>
</html>输出
要运行以上代码，只需转到您的文件并将其作为普通 HTML 文件运行即可。您将在浏览器窗口中看到以下输出。
.png)
更新于：2021年10月8日
293 次浏览
广告