AngularJs自定义指令

最新推荐文章于 2025-08-11 19:52:03 发布

转载最新推荐文章于 2025-08-11 19:52:03 发布 · 53 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/zella/p/6899443.html

文章标签：

#javascript #ViewUI

本文介绍了如何在AngularJS及Ionic框架中定义自定义指令。包括指令的基本写法、限制条件、模板链接、控制器设置等内容，并提供了具体示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、angularJs写法

var app = angular.module("myApp", []);
app.directive("myDirective", function() {
    return {
        restrict : "A",
        template : "<h1>自定义指令!</h1>"
    };
});

2、ionic工程写法

angular.module('ysw.directives', [])

/* 自定义 */
.directive('myHeader', function () {
    return {
        restrict: 'E',
        scope: false,
        templateUrl: 'templates/headerNav.html',
        controller: 'HeaderCtrl'
    };
})

说明：

1、directives.js为js文件夹下的文件，所有的自定义指令都写在该文件中。

2、restrict为指令的调用方式，默认为EA