浅谈angularJS 作用域

[复制链接]
查看: 32|回复: 1
  • TA的每日心情
    慵懒
    2018-4-28 09:37
  • 1459

    主题

    1479

    帖子

    11万

    积分

    管理员

    小语

    Rank: 9Rank: 9Rank: 9

    积分
    110351
    发表于 2018-4-3 09:48:04 | 显示全部楼层 |阅读模式

    这篇文章主要介绍了浅谈angularJS 作用域的相关资料,需要的朋友可以参考下

      ?

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    <!doctype html>
    <html ng-app="firstApp">
    <head>
    <meta charset="utf-8">
    <script src="angular-1.3.0.js"></script>
    </head>
    <body>

    <div ng-controller="parentCtrl">
    <input ng-model="args">
    <div ng-controller="childCtrl">
    <input ng-model="args">
    </div>
    </div>
    <script>
    var app=angular.module('firstApp',[]);
    app.controller('parentCtrl',function($scope) {
    $scope.args = '123';
    }).controller('childCtrl', function($scope) {

    });
    </script>

      案例说明:

      虽然在 childCtrl 中没有定义具体的 args 属性,但是因为 childCtrl 的作用域继承自 parentCtrl 的作用域,

      因此,childCtrl通过原型链 到父作用域args 属性并设置到input中。且在父input中输入值自己动同步到子input中

      但是反之不行。即子中修改,无法改变父中的值,且导致父修改后子也不同步了,原因:在子作用域input输入内容时,

      因为 HTML 代码中 model 明确绑定在 childCtrl 的作用域中,因此 AngularJS 会为 childCtrl 生成一个 args 原始类型属性。

      根据 AngularJS 作用域继承原型机制,childCtrl 在自己的作用域找到args属性值,故就不从父中查找args值。

      导致最终子作用域有args,父作用域有args,子和父之间的值不会再保持同步。

      以上所述就是本文的全部内容了,希望大家能够喜欢。


    该用户从未签到

    0

    主题

    12

    帖子

    132

    积分

    注册会员

    Rank: 2

    积分
    132
    QQ
    发表于 2018-5-9 21:44:37 | 显示全部楼层
    啥也不说了,感谢楼主分享哇!
    回复

    使用道具 举报

    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    精选推荐

    在线客服
    热线电话

    微信公众账号
    返回顶部 关注微信 下载APP 返回列表