Angularjs中controller的三种写法分享

 更新时间:2016年09月21日 11:53:20   投稿:daisy  
这篇文章给大家介绍了angularjs中controller的三种写法,每种写法都给出了示例代码,对大家理解和学习很有帮助,有需要的朋友们可以参考借鉴。

GPT4.0+Midjourney绘画+国内大模型 会员永久免费使用!
如果你想靠AI翻身,你先需要一个靠谱的工具!

前言

在Angular中,Directive、Service、Filter、Controller都是以工厂方法的方式给出,而工厂方法的参数名对应着该工厂方法依赖的Service。angularjs中controller其实就是一个方法,它有三种写法,下面来一起看看吧。

第一种:

1
2
3
4
5
6
<pre name="code" class="javascript">var AppController = ['$scope', function($scope){
   $scope.notifyServiceOnChage = function(){
   console.log($scope.windowHeight);
 };
}];
app.controller('AppController',AppController);

在定义AppController的时候,先声明方法需要注入的参数,然后再定义方法体。最后将AppController绑定到app上。

第二种:

1
2
3
4
5
app.controller('AppController', function($scope){
  $scope.notifyServiceOnChage = function(){
   console.log($scope.windowHeight);
 };
})

直接在app的controller属性定义,首先是controller名字,然后是方法体。

第三种:

1
2
3
4
5
function AppController($scope) {
  $scope.notifyServiceOnChage = function(){
   console.log($scope.windowHeight);
 };
}

直接写方法,然后在ng-controller引用该方法

总结

以上就是关于angularjs中controller三种写法的全部内容,不知道大家都学会了没有,希望这篇文章的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流。

蓄力AI

微信公众号搜索 “ 脚本之家 ” ,选择关注

程序猿的那些事、送书等活动等着你

相关文章

  • Angularjs自定义指令实现分页插件(DEMO)

    Angularjs自定义指令实现分页插件(DEMO)

    由于最近的一个项目使用的是angularjs1.0的版本,涉及到分页查询数据的功能,后来自己就用自定义指令实现了该功能,下面小编把实例demo分享到脚本之家平台,需要的朋友参考下
    2017-09-09
  • AngularJS HTML DOM详解及示例代码

    AngularJS HTML DOM详解及示例代码

    本文主要介绍AngularJS HTML DOM基础知识,这里整理了相关资料和示例代码进行详解,有需要的小伙伴可以参考下
    2016-08-08
  • angularjs实现table增加tr的方法

    angularjs实现table增加tr的方法

    下面小编就为大家分享一篇angularjs实现table增加tr的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-02-02
  • 前后端如何实现登录token拦截校验详解

    前后端如何实现登录token拦截校验详解

    这篇文章主要给大家介绍了关于前后端如何实现登录token拦截校验的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2018-09-09
  • AngularJS实现路由实例

    AngularJS实现路由实例

    本文给大家分享的是使用angularjs路由框架实现的一个简单页面跳转功能,非常的实用,也很详细,有需要的小伙伴可以参考下
    2017-02-02
  • 浅谈Angular HttpClient简单入门

    浅谈Angular HttpClient简单入门

    本篇文章主要介绍了浅谈Angular HttpClient 简单入门,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-05-05
  • AngularJS模态框模板ngDialog的使用详解

    AngularJS模态框模板ngDialog的使用详解

    这篇文章主要介绍了AngularJS模态框模板ngDialog的使用详解,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-05-05
  • AngularJS使用ng-class动态增减class样式的方法示例

    AngularJS使用ng-class动态增减class样式的方法示例

    这篇文章主要介绍了AngularJS使用ng-class动态增减class样式的方法,结合具体实例形式分析了ng-class操作页面class样式的相关技巧,需要的朋友可以参考下
    2017-05-05
  • Angular X中使用ngrx的方法详解(附源码)

    Angular X中使用ngrx的方法详解(附源码)

    ngrx是一套利用RxJS的类库,下面这篇文章主要给大家介绍了关于Angular X中使用ngrx的方法,文中通过示例代码介绍的非常详细,对大家具有一定的参考学习价值,需要的朋友们下面来一起看看吧。
    2017-07-07
  • 简述AngularJS相关的一些编程思想

    简述AngularJS相关的一些编程思想

    这篇文章主要介绍了AngularJS相关的一些编程思想,AngularJS是一款热门的JavaScript库,推荐!需要的朋友可以参考下
    2015-06-06

最新评论