angularJS 中$attrs方法使用指南
这里给大家分享的是一个angularJS 中$attrs方法的使用示例：
<!doctype html> <html> <head> <meta charset="utf-8"> <title> 无标题文档 </title> <script src="http://localhost:81/js/jquery.js"> </script> <script src="http://localhost:81/js/angular.min.js"> </script> </head> <body ng-app="Demo"> <div a> a_directive </div> <div ng-controller="TestCtrl"> <h1 t> 原始内容 </h1> <h2 t2> 原始内容 </h2> <h3 t3="hiphop" title2="{{name}}"> 原始内容 </h3> <div compile></div> <div> <test a="{{ a }}" b c="xxx"></test> <button ng-click="a=a+1"> 修改 </button> </div> <te a="1" ys-a="123" ng-click="show(1)">这里</te> </div> <script> var app = angular.module('Demo', [], angular.noop); app.controller("TestCtrl", function($scope) { $scope.name = "qihao"; }); app.directive("t", function() { return { controller : function($scope){$scope.name = "qq"}, template : "<div>test:implementToParent{{name}}</div>", replace : true, scope : true //作用域是继承的,默认就是继承的 } }); app.directive("t2", function() { return { controller : function($scope){$scope.name = "nono"}, template : "<div>test:implementToParent{{name}}</div>", replace : true, restrict : "AE" } }); app.directive("t3", function() { return { template : "<div>test:implementToParent_titleIs:{{title}}<br>title2Is:{{title2}}</div>", replace : true, restrict : "AE", scope : { title : "@t3", title2 : "@title2" } } }); app.directive('a', function() { var func = function() { console.log('compile'); return function() { console.log('link'); } } var controller = function($scope, $element, $attrs, $transclude) { //$transclude ：是指令标签的复制体 console.log('controller'); console.log($scope); console.log($transclude); //$transclude接受两个参数，你可以对这个克隆的元素进行操作， var node = $transclude(function(clone_element, scope) { $element.append(clone_element); $element.append("<span>spanTag___</span>"); console.log(clone_element); console.log('--'); console.log(scope); }); console.log(node); } return { compile: func, template: "<h1 ng-transclude></h1>", controller: controller, transclude: true, restrict: 'AE' } }); app.directive('compile',function() { var func = function() { console.log('a compile'); return { pre: function() { console.log('a link pre') }, post: function() { console.log('a link post') }, } } return { restrict : "AE", compile : func } }) app.directive('test', function(){ var func = function($element, $attrs){ console.log($attrs); $attrs.$observe('a', function(new_v){ console.log(new_v); }); } return {compile: func, restrict: 'E'} }); app.controller('TestCtrl', function($scope){ $scope.a = 123; }); app.directive('te', function(){ var func = function($scope,$element, $attrs,$ctrl){ console.log($ctrl) //$attrs.$set. 给这个属性设置b，值为ooo，就是这样 $attrs.$set('b', 'ooo'); $attrs.$set('a-b', '11'); //这个还有点不懂啊 //第二个参数值 $attrs.$set('c-d', '11', true, 'c_d'); console.log($attrs); } return { compile: function(){ return func }, restrict: 'E' } }); app.controller('TestCtrl', function($scope){ $scope.show = function(v){console.log(v);} }); </script> </body> </html>
本文内容就到这里了，希望大家能对angularJS 中$attrs的使用有了新的认识，希望大家能够喜欢本文。
-
本文向大家介绍angularJS 中$scope方法使用指南，包括了angularJS 中$scope方法使用指南的使用技巧和注意事项，需要的朋友参考一下 以上就是关于angularJS 中$scope方法使用指南的全部内容了，希望大家能够喜欢。
-
那么，的目的是什么？不能访问通过传递的所有属性。为什么一个max的访问值不能作为而不是 为什么要像那样分配回来？ 谢了。
-
本文向大家介绍Angularjs中使用指令绑定点击事件的方法，包括了Angularjs中使用指令绑定点击事件的方法的使用技巧和注意事项，需要的朋友参考一下 项目中，模板中的菜单是jQuery控制的，在Angularjs中就运行不到了，因为菜单项是ng-repeat之后的。 如html Jquery给第一级a链接绑定事件代码像: 因为我之前看过文档说，Angularjs的Controller不处理D
-
本文向大家介绍在AngularJS中使用AJAX的方法，包括了在AngularJS中使用AJAX的方法的使用技巧和注意事项，需要的朋友参考一下 AngularJS提供$http控制，可以作为一项服务从服务器读取数据。服务器可以使一个数据库调用来获取记录。 AngularJS需要JSON格式的数据。一旦数据准备好，$http可以用以下面的方式从服务器得到数据。 在这里，data.txt中包含的学生记
-
本文向大家介绍javascript中hasOwnProperty() 方法使用指南，包括了javascript中hasOwnProperty() 方法使用指南的使用技巧和注意事项，需要的朋友参考一下 概述 hasOwnProperty() 方法用来判断某个对象是否含有指定的自身属性。 语法 obj.hasOwnProperty(prop) 参数 •prop •要检测的属性名称。 描述 所有继承了
-
本文向大家介绍jQuery中hover方法和toggle方法使用指南，包括了jQuery中hover方法和toggle方法使用指南的使用技巧和注意事项，需要的朋友参考一下 jQuery提供一些方法（如：toggle）将两种事件效果合并到一起，比如：mouseover、mouseout；keyup、keydown等 1、hover函数 hover(over,out)一个模仿悬停事件（鼠标移动