angularjs 指令scope中“=”、“@”、“&”的區(qū)別

call_me_R 發(fā)布于2019-08-20 15:55 / 1055人閱讀

HTML


    Parent Scope
     // Update to see how parent scope interacts with component scope    
    


    
    
        Attribute
        
            get: {{isolatedAttributeFoo}}
        
        
            set: 
            // This does not update the parent scope.
            

            set: 
            // This does not update the parent scope.
        
        Binding
        
            get: {{isolatedBindingFoo}}
        
        
            set: 
            // This does update the parent scope.
            
        
        Expression    
        
            
            
            // And this calls a function on the parent scope.

var myModule = angular.module("myModule", [])
    .directive("myComponent", function () {
        return {
            restrict:"E",
            scope:{
                /* NOTE: Normally I would set my attributes and bindings
                to be the same name but I wanted to delineate between 
                parent and isolated scope. */ 
                isolatedBindingString:"@attributeString",
                isolatedAttributeFoo:"@attributeFoo",
                isolatedBindingFoo:"=bindingFoo",
                isolatedExpressionFoo:"&"
            }        
        };
    })
    .controller("MyCtrl", ["$scope", function ($scope) {
        $scope.foo = "Hello!";
        $scope.updateFoo = function (newFoo) {
            $scope.foo = newFoo;
        }
    }]);

代碼和效果地址

云服務(wù)器 GPU云服務(wù)器 asp中&lt&gt的意思中SP與DP的區(qū)別 php中&amp php中&amp039

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://specialneedsforspecialkids.com/yun/82590.html

相關(guān)文章

angularjs 指令scope中“=”、“@”、“&amp;”的區(qū)別

HTML Parent Scope // Update to see how parent scope interacts with component scope Attribute get: {{isolatedAttributeFoo}} ...

joyvw 2019-08-01 16:42 評(píng)論0 收藏0
淺談AngularJS模板

摘要：這使得許多人并未真正了解的模板，而認(rèn)為只是提供了一堆內(nèi)置指令并可用于文件。是個(gè)對(duì)于模板很重要的指令，它是基本的條件表達(dá)，滿足條件時(shí)則存在，不滿足則不存在。則是另一重要指令，能循環(huán)創(chuàng)建。 showImg(http://segmentfault.com/img/bVcJtv); 作為最流行的MVVM（Model-View-View-Model）框架之一，相信大部分前端對(duì)AngularJS...

fredshare 2019-08-21 12:25 評(píng)論0 收藏0
angularJS directive用法詳解

摘要：可選參數(shù)，布爾值或者對(duì)象默認(rèn)值為，可能取值默認(rèn)值。布爾值或者字符，默認(rèn)值為這個(gè)配置選項(xiàng)可以讓我們提取包含在指令那個(gè)元素里面的內(nèi)容，再將它放置在指令模板的特定位置。前言最近學(xué)習(xí)了下angularjs指令的相關(guān)知識(shí)，也參考了前人的一些文章，在此總結(jié)下。歡迎批評(píng)指出錯(cuò)誤的地方。 Angularjs指令定義的API showImg(https://segmentfault.com/img...

hlcc 2019-08-20 11:09 評(píng)論0 收藏0
創(chuàng)建自定義指令

摘要：我們通常通過(guò)其區(qū)分大小寫(xiě)的規(guī)范化名稱例如，來(lái)定義指令。在其目前的實(shí)現(xiàn)上，我們應(yīng)該需要去創(chuàng)建一些不同點(diǎn)控制器用來(lái)重用這個(gè)指令。如此，綁定是理想的將回調(diào)函數(shù)綁定到指令行為。這被指令調(diào)用指明。前綴表示該指令在其父元素上搜索控制文檔翻譯至angularjs.org. 文檔解釋了您何時(shí)想在AngularJS應(yīng)用程序中創(chuàng)建自己的指令，以及如何實(shí)現(xiàn)它們。 | 建議搭配原文食用 | 什么是指令？在...

zzbo 2019-08-26 11:55 評(píng)論0 收藏0
AngularJS學(xué)習(xí)筆記(2) --- 指令參數(shù)和scope綁定策略

摘要：引言指令可以說(shuō)是的核心，而其開(kāi)發(fā)也是比較困難的，本文主要介紹指令的一些參數(shù)和的綁定策略。指令執(zhí)行的優(yōu)先級(jí)，用于多個(gè)指令同時(shí)作用于同一個(gè)元素時(shí)。改變父會(huì)影響指令，而改變指令不會(huì)影響父。在父和指令之間建立雙向綁定。引言指令(Directive)可以說(shuō)是 AngularJS 的核心，而其開(kāi)發(fā)也是比較困難的，本文主要介紹指令的一些參數(shù)和scope的綁定策略。參數(shù) 從 AngularJS ...

AndroidTraveler 2019-08-21 15:12 評(píng)論0 收藏0