angular33-自定义指令

简介: angular33-自定义指令

image.png

<!DOCTYPE html>
     <html lang="en">
     <head>
         <meta charset="UTF-8">
         <meta name="viewport" content="width=device-width, initial-scale=1.0">
         <title>Document</title>
     </head>
     <body ng-app="myApp1">
         <itbutton></itbutton>
         <itbutton1></itbutton1>
         <script src="./js/Angular.js"></script>
         <script>
             var myApp1 = angular.module('myApp1', []);
             //第一个参数是指令的名字 第二个参数应该使用一个数组
             //数组的最后一个元素是一个函数
             myApp1.directive('itbutton', [function() {
                 return {
                     template: '<div>geyao</div>'
                 };
             }])
             myApp1.directive('itbutton1', [function() {
                 return {
                     template: '<div>geyao</div>'
                 };
             }])
         </script>
     </body>
     </html>

image.png

相关文章
|
6月前
|
测试技术 网络架构 容器
什么是 Angular 的 outlet
什么是 Angular 的 outlet
33 0
Angular双向绑定简单理解
Angular双向绑定简单理解
54 0
angular38-angular实现todolist2添加
angular38-angular实现todolist2添加
81 0
angular38-angular实现todolist2添加
angular37-angular实现todolist基本结构
angular37-angular实现todolist基本结构
115 0
angular37-angular实现todolist基本结构
angular39-angular实现todolist2删除
angular39-angular实现todolist2删除
88 0
angular39-angular实现todolist2删除
angular40-angular实现todolist3编辑功能
angular40-angular实现todolist3编辑功能
81 0
angular40-angular实现todolist3编辑功能
|
JavaScript 前端开发
Angular 自定义指令 Tooltip
Yeah,关注我的读者应该知道,上一篇文章了解 Angular 开发的内容,我们已经概览了 Angular 的相关内容。在自定义指令的部分,我们已经能够实现编写,但是,在实际场景中,我们还需要标准化的管理。
Angular 自定义指令 Tooltip
|
JavaScript 前端开发 容器
在Angular应用里使用Redux
在Angular应用里使用Redux
在Angular应用里使用Redux
|
JavaScript 前端开发
Angular数据绑定的学习笔记
https://angular.io/guide/property-binding
Angular数据绑定的学习笔记