程序员

控制器(一)

2018-07-06  本文已影响0人  全村的希望iOS

简介

        Angular注重模块化,将每一块功能可以做成一个单独的模块便于以后的维护,从而降低公司的维护成本,在我们没有用控制器之前数据的初始化在ng-init里面,但是很多初始化数据的时候我们不能都写在ng-init里面看起来让人不舒服,甚至还会有方法更加不能这么做,html只做简单的数据展示,接下来会分成两节来讲controller

控制器基本写法

        angular.module(name, array);创建一个模块

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

       创建控制器有两种写法

           方法一:

            app.controller("myController",function($scope){

                    推断式注入

                    注意:angular方法中的参数只能是$scope

                    $scope是一个作用域所有数据和方法都要绑定到它的上面这                        样angular环境下才能访问得到

                    坏处:代码压缩可能会将$scope压缩成别的单词这样程序就会报错

                    不推荐

             })

           方法二:

               app.controller("myController",["$scope",function($scope) {

                    内联试注入

                    优点:防止压缩破坏$scope,方法型参任意改名(例如参数可以改成val)

                    推荐使用

                }])

完整例子

    <html ng-app="myApp">

            <body ng-controller="myController">

                    {{name}}  输入name

                    {{textFun()}}调用方法

            </ body>

            <script>

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

                app.controller("myController",["$scope",function($scope) {

                        定义一个名字为name的字符串

                        $scope.name = "我的名字叫Angular";

                        定义一个方法

                        $scope.textFun = function() {

                                return "angular"

                        }

                }])

            </ script>

     </ html>


代码中的指令:

ng-app=""开始我们默认给空默认是当前的节点写,我们创建一个模块名字叫myApp那么ng-app="myApp"告诉angular这个节点属于myApp这个模块,一般情况下ng-app写在Dom的跟节点上

ng-controller="myController"绑定一个模块下的控制器,控制器里面初始化的所有数据和方法都保存到$scope这个作用域下,angular可以通过作用于获取定义的所有值和方法

注意:Dom上可以绑定多个模块,一个模块可以绑定多个控制器

喜欢博主的技术文章可以关注博主,博主也会不断学习新的技术分享给大家,有不对的地方欢迎大家指出,博主会虚心学习,谢谢大家


                                                      不积跬步无以至千里,不积小流无以成江海

上一篇下一篇

猜你喜欢

热点阅读