关于angular中指令调用controller的方法:&

原创 2015年11月18日 13:59:13

html:

<!doctype html>
<html ng-app="app">
    <head>
    </head>
    <body>

        <div ng-controller="MyCtrl">
            <greeting aa="sayHello(name)"></greeting><br>
            <greeting aa="sayHello(name)"></greeting><br>
            <greeting aa="sayHello(name)"></greeting><br>
        </div>
        <script src="angular.min.js"></script>
        <script src="js/cc.js"></script>
    </body>
</html>

js:

var app = angular.module('app', []);

app.controller('MyCtrl', function($scope){
    $scope.sayHello = function(name) {
        alert("Hello"+name);
    }
})

app.directive("greeting", function(){
    return {
        scope: {
            greet: '&aa'
        },
        restrict: "AE",
        template: '<input type="text" ng-model="username"><br><button ng-click="greet({name:username})">click</button>'
    }
});

首先,scope中的@aa匹配html中的aa的内容(是个方法),然后将greet指向sayHello,参数绑定了input的内容username,将name的值指向username,点击按钮调用方法。

相关文章推荐

AngularJS控制器controller通信方法

1,利用作用域继承的方式。即子控制器继承父控制器中的内容 2,基于事件的方式。即$on,$emit,$boardcast这三种方式 3,服务方式。写一个服务的单例然后通过注入来使用 ...

AngularJs 指令directive之controller,link,compile

关于自定义指令的命名,你可以随便怎么起名字都行,官方是推荐用[命名空间-指令名称]这样的方式,像ng-controller。不过你可千万不要用 ng-前缀了,防止与系统自带的指令重名。另外一个需知道的...

angular.js指令(directive)中的controller,compile,link函数有什么不同?

到目前为止,用angualrjs去做开发也有两个月了.做为一个菜鸟,难免会被大神吊打(这里有一个悲伤的故事...);某一天,一位前端大神问我:你知道angular指令中的controller,comp...

angularjs,js调用angularjs中的方法和参数

function my_controller($scope) { window.scope = $scope; var vm = $scope.vm =...

《AngularJS》--指令的相互调用

人们喜欢AngularJS,因为他很有特色,其中他的指令和双向数据绑定很吸引着人们,那么,AngularJS的指令有什么作用哪?指令之间的是怎样相互调用的哪?        下面有一个小小的Demo,...

angularJs控制器执行顺序

js书写控制器的顺序无所谓,它不会立刻实例化这些控制器,也不会在加载js以后就执行控制器里的代码,也不会注入服务和指令. 当解析html的时候,它的ng-controller遇到什么控制器,它就去实例...

angularjs controller之间的通信

接触了angularjs有一段时间了,最近遇到一个问题,需要在controller之间进行通信,当初想了一下,并不是很难,angularjs不是有个rootscope吗, 于是我就在其中一个cont...

JS无法调用Controller(已解决)

经过了一天的反思,终于痛定思痛开始好好写代码了,但是事情不总是那么的容易刚想一展拳脚就遇到一个困扰了我一天的问题。不过提高班人才济济。     闲话少说。先看一下事故现场。     事故现场     ...

MVC学习笔记之使用JQuery方式发送Ajax请求调用后台Controller

通常情况下在MVC模式中我们会采用使用controller获取业务数据(model)并将业务数据提交给view,或者由view传递数据给controller,再由controller更新model。在...

angularJS 自定义指令 方法属性:controller 和属性:controllerAs

自定义指令中还可以定义controller属性,是一个function,可以在其中定义数据和方法,可以提供给该指令的link内的方法使用。 示例的html: ...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:关于angular中指令调用controller的方法:&
举报原因:
原因补充:

(最多只允许输入30个字)