1、index.html:

<!DOCTYPE HTML>
<html ng-app="app">
<head>
    <title>scopeEqual</title>
    <meta charset="utf-8">    
    <link rel="stylesheet" href="../css/bootstrap.css">
    <script src="../js/angular.js"></script>
</head>
<body>
<!-- 下面是指令scope作用域=符demo. -->
<div ng-controller="myCtrl">
    <label for="" class="control-label">控制器中的内容：</label>
    <input type="text" ng-model="ctrlFlavor" />
    <label for="" class="control-label">指令中的内容：</label>
    <drink flavor="ctrlFlavor"></drink>
</div>
<script src="./scopeEqual.js"></script>
</body>
</html>

2、scopeEqual.js：

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

myModule.controller('myCtrl', ['$scope', function($scope){
    $scope.ctrlFlavor = "百事达";
}]);
myModule.directive('drink',function(){
    return {
        restrict: 'AE',
        scope:{
            fla:'=flavor'//还是传递同标签内的属性值，就能形成双向数据绑定.在独立作用域中同样是ng-model中的值，要想形成双向ng-model数据绑定的赋值形式的话必须用=号赋属性值给ng-model才行.fla是ng-model值，标签属性flavor获取的是控制器中所赋的值
        },
        template: '<input type="text" ng-model="fla" />',
        // link: function(scope, elm, attrs) {
        //     scope.fla = scope.ctrlFlavor;//这样写虽然能把控制器中的初始值赋给ng-model="fla"中的fla，但是与上一个input里面的ng-model="ctrlFlavor"形成不了双向数据绑定，就是你我均独立，互不干扰，互不影响，所以要实现双向数据绑定，还得借助于scope:里面的等号"="双向绑定机制
        // }
    }
});

--@angularJS--独立作用域scope绑定策略之=符策略的更多相关文章

  1. --@angularJS--独立作用域scope绑定策略之&符策略

    1.index.html: <!DOCTYPE HTML><html ng-app="app"><head>    <title>s ...

  2. 理解AngularJS的作用域Scope

    AngularJS中,子作用域一般都会通过JavaScript原型继承机制继承其父作用域的属性和方法.但有一个例外:在directive中使用scope: { ... },这种方式创建的作用域是一个独 ...

  3. 理解angularJS中作用域$scope

    angularJS中作用域是什么 作用域(scope)是构成angularJS应用的核心基础,在整个框架中都被广泛使用,因此了解它如何工作是非常重要的 应用的作用域是和应用的数据模型相关联的,同时作用 ...

  4. angularjs指令系统系列课程（4）：作用域Scope

    指令的scope对象是一个很重要,很复杂的对象,我们这一节作为重点讲解 可取值: 1.false(默认), 2.true, 3.{}(object) 1.false:默认值,不创建新的作用域 2.tr ...

  5. 【AngularJS】—— 12 独立作用域

    前面通过视频学习了解了指令的概念,这里学习一下指令中的作用域的相关内容. 通过独立作用域的不同绑定,可以实现更具适应性的自定义标签.借由不同的绑定规则绑定属性,从而定义出符合更多应用场景的标签. 本篇 ...

  6. angularJS（二）：作用域$scope、控制器、过滤器

    app.controller创建控制器 一.作用域 Scope(作用域) 是应用在 HTML (视图) 和 JavaScript (控制器)之间的纽带. Scope 是一个对象,有可用的方法和属性. ...

  7. AngularJS讲义 - 作用域

    什么是作用域? Angular中作用域(scope)是模板以及工作的上下文环境,作用域中存放了应用模型和视图相关的回调行为.作用域是层次化结构的与相关联的DOM结构相对应.作用域可以观察表达式以及传播 ...

  8. AngularJS 深入理解 $scope 转载▼

    AngularJS 深入理解 $scope 转载▼ (2015-04-07 14:09:50)     $scope 的使用贯穿整个 AngularJS App 应用,它与数据模型相关联,同时也是表达 ...

  9. AngularJs 隔离作用域

    初学NG,有诸多的不解,今天看了一篇文章,原文地址:https://segmentfault.com/a/1190000002773689#articleHeader0 ,本文运行的代码也出处此. 里 ...

随机推荐

  1. 深入Java单例模式(转)

    深入Java单例模式 源自 http://devbean.blog.51cto.com/448512/203501 在GoF的23种设计模式中,单例模式是比较简单的一种.然而,有时候越是简单的东西越容 ...

  2. c# winform 点击按钮切换tabcontrol标签

    this.tabControl1.TabPages.Remove(tabPage1); this.tabControl1.TabPages.Remove(tabPage2); this.tabCont ...

  3. RSA非对称加密Java实现

    原文 加密基础方法类 import java.security.MessageDigest; import sun.misc.BASE64Decoder; import sun.misc.BASE64 ...

  4. decoder3_8

    这两天回归书本,继续阅读书上的内容,此时的体会与刚开始学那会的体会是不一样的,比如3_8decoder,之前就认为可以用case来写,而书上有一种更简便的方式来描述,带给你新的思路,既然有新方式可以描 ...

  5. Kafka 在行动：7步实现从RDBMS到Hadoop的实时流传输

    原文:https://coyee.com/article/11095-kafka-in-action-7-steps-to-real-time-streaming-from-rdbms-to-hado ...

  6. Smali文件语法解析

    大家都应该知道APK文件其实就是一个MIME为ZIP的压缩包,我们修改ZIP后缀名方式可以看到内部的文件结构,例如修改后缀后用RAR打开鳄鱼小顽皮APK能看到的是(Google Play下载的完整版版 ...

  7. 改变nova-compute默认位置的方法

    # cat /etc/nova/nova.conf |grep -n state_path|grep -v '#'314:state_path=/var/lib/nova

  8. 织梦网站底部的Power by DedeCms怎么去掉？

    由于织梦DEDECMS程序6月份的漏洞,很多织梦网站都被黑了,所以大家都在抓紧时间更新系统补丁.但是这次的DEDECMS V5.7版本更新后,在前台网页底部会出现织梦版权信息 “powered by ...

  9. Linux的iptables常用配置范例（1）

    以下是来自 http://wiki.ubuntu.org.cn/IptablesHowTo 上的配置说明 可以通过/sbin/iptables -F清除所有规则来暂时停止防火墙: (警告:这只适合在没 ...

  10. VS2012配置Cocos2d-x的问题

    cocos2d-x老是配置不成功,解决方案参考:http://blog.csdn.net/yangjingui/article/details/9408007 完整配置流程: 1 下载,最好通过SVN ...