AngularJS指令与控制器之间的交互功能示例
更新时间：2016年12月14日 10:36:16 作者：小小小小小亮
这篇文章主要介绍了AngularJS指令与控制器之间的交互功能,结合实例形式分析了AngularJS控制器调用相关指令操作技巧,需要的朋友可以参考下
本文实例讲述了AngularJS指令与控制器之间的交互功能。分享给大家供大家参考，具体如下：
本节我们来看控制器与指令之间的交互
1.首先来看最简单的，在指令中调用父控制器的方法：
<div ng-controller="myController1"> </div>
app.controller('myController1',['$scope',function($scope){
$scope.load=function(){
console.log('正在加载数据......');
}
}]);
app.directive('myTest',function(){
return{
restrict:'E',
link:function(scope,ele,attr){
ele.bind('mouseenter',function(){
scope.load();
})
}
}
})
在第一节中，我们已经知道了如何在指令的scope参数中调用父控制器中的方法，这里的：
scope.load();
也可以写成：
scope.$apply('load()');
2.同一个指令，在动态调用多个父类控制器中的方法：
<div ng-controller="myController1" loadMore="load1()"</div> <div ng-controller="myController2" loadMore="load2()"></div>
app.controller('myController1',['$scope',function($scope){
$scope.load1=function(){
console.log('正在加载数据......');
}
}]);
app.controller('myController2',['$scope',function($scope){
$scope.load2=function(){
console.log('正在加载数据........');
}
}]);
app.directive('myTest',function(){
return{
restrict:'E',
link:function(scope,ele,attr){
ele.bind('mouseenter',function(){
scope.$apply(attr.loadmore())
})
}
}
})
注意这里：
scope.$apply(attr.loadmore());
loadmore是小写，而在html中，属性是通过驼峰法则得到的。
更多关于AngularJS相关内容感兴趣的读者可查看本站专题：《AngularJS入门与进阶教程》及《AngularJS MVC架构总结》
希望本文所述对大家AngularJS程序设计有所帮助。
相关文章
本篇文章主要介绍了详解angular笔记路由之angular-router，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-09-09
这篇文章主要介绍了angularJs的ng-class切换class,小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-06-06
这篇文章主要介绍了浅谈Angular 的变化检测的方法,小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-03-03
ios设备中angularjs无法改变页面title的解决方法
今天小编就为大家分享一篇ios设备中angularjs无法改变页面title的解决方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-09-09
angularjs使用gulp-uglify压缩后执行报错的解决方法
下面小编就为大家分享一篇angularjs使用gulp-uglify压缩后执行报错的解决方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-03-03
本篇文章主要介绍了Angular4自制一个市县二级联动组件示例，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-11-11
本文详细介绍了AngularJS控制器之间的数据共享与通信，对angularjs共享数据及通信相关知识感兴趣的朋友可以一起学习。2016-08-08
这篇文章主要介绍了AngularJS中watch监听用法,较为详细的分析了$watch的具体功能、相关参数用法与使用注意事项,需要的朋友可以参考下2016-11-11
这篇文章主要介绍了Angular开发实践之服务端渲染，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-03-03
AngularJS实现controller控制器间共享数据的方法示例
这篇文章主要介绍了AngularJS实现controller控制器间共享数据的方法,结合简单实例形式分析了AngularJS控制器数据共享的实现方法,需要的朋友可以参考下2017-10-10
最新评论