zoukankan      html  css  js  c++  java
  • --@angularJS--独立作用域scope绑定策略之@符策略

    1、index.html:

    <!DOCTYPE HTML>
    <html ng-app="app">
    <head>
        <title>scopeAt</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">
        <drink flavor={{ctrlFlavor}}></drink>
    </div>
    <script src="./scopeAt.js"></script>
    </body>
    </html>

    2、scopeAt.js:

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

    myModule.controller('myCtrl', ['$scope', function($scope){
        $scope.ctrlFlavor = "aaaaaaaaaaaaaaa";
    }]);
    myModule.directive('drink',function(){
        return {
            restrict: 'AE',
            scope:{
                fla:'@flavor'//独立作用域中表达式跟属性之间的交互传值,效果等同下面的link:方法——将属性attrs.flavor的值赋给scope.fla作用域中表达式变量fla中,而属性值来自于控制器赋值
            },
            template: '<div>{{fla}}</div>',
            // link: function(scope, elm, attrs) {
            //     scope.fla = attrs.flavor;//意为将属性flavor的值赋给模板div中的表达式{{fla}}中
            // }
        }
    });

  • 相关阅读:
    口腔溃疡
    English 好的报纸
    线段树
    归并排序 霍纳规则(法则) 统计逆序对
    xfce4桌面自动整理脚本
    解决xubuntu的thunar第一次启动慢
    解决ibus图标为红圈(图标丢失)
    linux tar 备份命令
    ubuntu中的Wine详解
    我的conky配置
  • 原文地址:https://www.cnblogs.com/koleyang/p/4516441.html
Copyright © 2011-2022 走看看