AngularJs 特性之指令系统

最新推荐文章于 2025-09-12 14:04:02 发布

转载最新推荐文章于 2025-09-12 14:04:02 发布 · 50 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/sherrykid/p/5730709.html

文章标签：

#javascript #ViewUI

本文介绍了如何在AngularJS中创建自定义指令，并通过一个示例展示了如何使用这些指令来扩展HTML的功能。文章还提到了ng-app指令的重要性，它是AngularJS应用的启动入口。

<!DOCTYPE html>
<html ng-app="myApp">
<head>
    <meta charset="utf-8">
    <script src="../../jslib/angular.min-1.5.8.js"></script>
</head>
<body>

    <hello></hello>
</body>
<script type="text/javascript">
    var app = angular.module('myApp', []);
    app.directive("hello",function () {
        return{
            restrict:'E',
            template:'<div>Hi Everyone</div>',
            replace:true
        }
    });
</script>
</html>

在HTML中，很明显是没有hello标签的，但是通过模块的directive方法，使用函数中的模板替换了hello标签

有了指令功能，我们可以自己封装一些很使用的指令标签

ng-app属性其实也是AngularJs的一个指令，类比于Java中的main函数，其是AngularJs执行的入口

在任意的一个页面中，AngularJs只允许出现一次

指令的本质，就是标签库

转载于:https://www.cnblogs.com/sherrykid/p/5730709.html