angularJs 之 Scope(作用域)

最新推荐文章于 2021-06-16 05:59:47 发布

梦无悔

最新推荐文章于 2021-06-16 05:59:47 发布

阅读量252

点赞数

分类专栏： angularjs 文章标签： angularjs

本文链接：https://blog.csdn.net/u014444571/article/details/71514266

版权

angularjs 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Scope(作用域)</title>
        <script  src="js/Angular.js"></script>
    </head>
    <body>
        <div ng-app="scopeApp" id="scopeApp" ng-controller="scopeController">
            <div>
                <h1>{{carname}}</h1>
                <h2>{{hello}}</h2>
                <button ng-click='sayHello()'>点我问好</button>    
            </div>
            <div>
                <h4>repeat重复读取</h4>
                <ul>
                    <li ng-repeat="x in names">{{x}}</li>
                </ul>
            </div>
            <div>
                <h3>{{lastName}}成员</h3>
                <ul>
                    <li ng-repeat="x in names">{{x}}  {{lastName}}</li>
                </ul>
            </div>
            <script>
                var app = angular.module('scopeApp', []);
                app.controller('scopeController', function($scope) {
                    $scope.carname = "Join";
                    $scope.sayHello = function(){
                        $scope.hello = "hello,"+$scope.carname;
                    }

                    $scope.names = ['join','tom','cat'];
                     $scope.lastName = "yelisob"
                });

            </script>
        </div>
        <hr />
        <div>
            <h3>scope解释</h3>
            当你在 AngularJS 创建控制器时，你可以将 $scope 对象当作一个参数传递:<br />
            scope 是模型。<br />
            scope 是一个 JavaScript 对象，带有属性和方法，这些属性和方法可以在视图和控制器中使用。<br />
        </div>

        <div>
            <h3>scope的作用范围</h3>
            当我们使用 ng-repeat 指令时，每个重复项都访问了当前的重复对象:<br />
            <h5>根作用域</h5>
            所有的应用都有一个 $rootScope，它可以作用在 ng-app 指令包含的所有 HTML 元素中。<br />
            $rootScope 可作用于整个应用中。是各个 controller 中 scope 的桥梁。用 rootscope 定义的值，可以在各个 controller 中使用<br />
            创建控制器时，将 $rootScope 作为参数传递，可在应用中使用：
        </div>

        <div>
            <h3></h3>
        </div>

        <div>
            <h3></h3>
        </div>
    </body>
</html>

梦无悔

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
angularJs 之 Scope(作用域)

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>Scope(作用域)</title> <script src="js/Angular.js"></script> </head> <body> <div ng-app="scopeApp" i
复制链接

扫一扫

专栏目录