zoukankan      html  css  js  c++  java
  • angularjs-作用域

      Scope(作用域) 是应用在 HTML (视图) 和 JavaScript (控制器)之间的纽带。

      Scope 是一个对象,有可用的方法和属性。

      Scope 可应用在视图和控制器上。

      $scope对象就是一个普通的JavaScript对象,但与传统的数据模型不一样,$scope并不负责处理和操作数据,它只是视图和HTML之间的桥梁,它是视图和控制器之间的胶水。

      $scope的所有属性,都可以自动被视图访问到。eg:

    <div ng-app="myapp">
           <h1>Hello {{ name }}</h1>
    </div>
    //我们希望{{ name }}变量是本地$scope的一个属性
    angular.module('myapp', [])
       .run(function($rootScope) {
         $rootScope.name = "World";         
    });

      作用域嵌套:

    <body ng-app="myapp">
        <p>we can access: {{ rootProperty }}</p>
        <div ng-controller="ParentController">
            <p>we can access: {{ rootProperty }} and {{parentProperty}}</p>
            <div ng-controller="ChildController">
                <p>
                    we can access:
                    {{ rootProperty }}and
                    {{ parentProperty }}and
                    {{ childProperty }}
                </p>
                <p>{{ fullSentenceFromChild }}</p>
            </div>
        </div>
        <script>
            angular.module('myapp', [])
            .run(function($rootScope) {
                //使用.run访问$rootScope
                $rootScope.rootProperty = 'root scope';
            })
            .controller('ParentController',function($scope){
                $scope.parentProperty = 'parent scope';
            })
            .controller('ChildController', function($scope){
                $scope.childProperty = 'child scope';
                $scope.fullSentenceFromChild = 'same $scope: we can access' + 
                $scope.rootProperty + 'and' + 
                $scope.parentProperty + 'and' +
                $scope.childProperty
            });
        </script>
    </body>

      运行结果:

      

  • 相关阅读:
    LeetCode 258 Add Digits
    LeetCode 231 Power of Two
    LeetCode 28 Implement strStr()
    LeetCode 26 Remove Duplicates from Sorted Array
    LeetCode 21 Merge Two Sorted Lists
    LeetCode 20 Valid Parentheses
    图形处理函数库 ImageTTFBBox
    php一些函数
    func_get_arg(),func_get_args()和func_num_args()的用法
    人生不是故事,人生是世故,摸爬滚打才不会辜负功名尘土
  • 原文地址:https://www.cnblogs.com/vicii/p/6489480.html
Copyright © 2011-2022 走看看