成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專(zhuān)欄INFORMATION COLUMN

AngularJS scope 學(xué)習(xí)

levius / 2360人閱讀

摘要：訪(fǎng)問(wèn)對(duì)象中從父類(lèi)繼承的對(duì)象時(shí)都會(huì)去訪(fǎng)問(wèn)原型鏈。因?yàn)榇颂幹谢旌嫌昧耍矔?huì)產(chǎn)生自己的，因此有和。在和兩種情況下會(huì)分別產(chǎn)生，是兩個(gè)不同的，號(hào)不同。

本文主要是學(xué)習(xí)別人的文章和回答之后的總結(jié)，此處給出鏈接深入學(xué)習(xí)AngularJS Scope

JavaScript原型繼承簡(jiǎn)介
AngularJs中是雙向數(shù)據(jù)綁定，但并不是每次修改都會(huì)產(chǎn)生相應(yīng)的效果，有些時(shí)候傳基礎(chǔ)類(lèi)型的值就有可能存在這種情況。JavaScript本身應(yīng)該也會(huì)存在這種情況的，先挖個(gè)坑，待我好好學(xué)學(xué)JavaScript之后再來(lái)填。

上圖是JavaScript的原型繼承圖，子類(lèi)會(huì)繼承父類(lèi)的屬性，讀子類(lèi)從父類(lèi)繼承的屬性的值時(shí)會(huì)去訪(fǎng)問(wèn)原型鏈，也就是一層一層向上直到找到父類(lèi)中的屬性。但是如果直接給子類(lèi)中基礎(chǔ)類(lèi)型的屬性賦值的話(huà)不會(huì)訪(fǎng)問(wèn)原型鏈，也就是會(huì)在子類(lèi)中建一個(gè)同名的新屬性，再次訪(fǎng)問(wèn)時(shí)父類(lèi)中的屬性就不會(huì)被訪(fǎng)問(wèn)到了。訪(fǎng)問(wèn)對(duì)象中從父類(lèi)繼承的對(duì)象時(shí)都會(huì)去訪(fǎng)問(wèn)原型鏈。

childScope.aString === "parent string" //true 訪(fǎng)問(wèn)了原型鏈
childScope.aNumber === 100 //true 訪(fǎng)問(wèn)了原型鏈

childScope.aNumber = 20 //不訪(fǎng)問(wèn)原型鏈，子類(lèi)中將增加一個(gè)新屬性，值為20
childScope.aString = "child string" //不訪(fǎng)問(wèn)原型鏈，子類(lèi)中將增加一個(gè)新的屬性，值為 child string
childScope.anArray[2] = 100 //訪(fǎng)問(wèn)了原型鏈，父類(lèi)中的anArray對(duì)象中第三個(gè)值被修改

AngularJS中ng-repeat、ng-switch和ng-include測(cè)試

    
    
    
        
        
        
        
        
        
    
    
        
    var TestScopeModule = angular.module("TestScopeModule", []);
    
    TestScopeModule.controller("TestScopeCtrl",["$scope",function ($scope) {
        $scope.list1 = ["value1","value2", "value3"];
        $scope.list2 = [{text : "value1"},{text : "value2"},{text : "value3"}];
        $scope.showScope = function (e) {
            console.log(angular.element(e.srcElement).scope());
        };
        $scope.loginData = false;
        $scope.parent = {};
        $scope.parent.loginData = false;
        $scope.login = function () {
            $scope.loginData = true;
        };
        $scope.logout = function () {
            $scope.loginData = false;
        };
        $scope.login1 = function () {
            $scope.parent.loginData = true;
        };
        $scope.logout1 = function () {
            $scope.parent.loginData = false;
        };    
    }])

以上是一小段測(cè)試代碼，分別測(cè)試了ng-repeat、ng-switch和ng-include，代碼中標(biāo)出了測(cè)試結(jié)果，也就是子scope和父scope的范圍。

parent scope中的屬性和值

第一個(gè)ng-repeat中第一個(gè)child scope，scope中有自己的item屬性和值，此處由于是基本的數(shù)據(jù)類(lèi)型，改變值時(shí)不會(huì)訪(fǎng)問(wèn)原型鏈，因此和parent scope中的值不一樣。ng-repeat會(huì)產(chǎn)生多個(gè)child scope，并且每個(gè)child scope中都會(huì)有自己的item屬性。

第二個(gè)ng-repeat中第一個(gè)child scope,scope中有自己的item屬性和值，此處item是對(duì)象，因此改變item對(duì)象中的value時(shí)會(huì)先去訪(fǎng)問(wèn)原型鏈，因此和parent scope中的值一樣

ngswitch 產(chǎn)生的child scope，可以看到$parent中是parent scope。因?yàn)榇颂巒gswitch中混合用了nginclude，nginclude也會(huì)產(chǎn)生自己的scope，因此有childHead和childTail。ngswitch在true和false兩種情況下會(huì)分別產(chǎn)生scope，是兩個(gè)不同的scope，id號(hào)不同。

這是ngswitch中nginclude產(chǎn)生的child scope，可以看到$parent的$id是12，也就是ngswitch產(chǎn)生的scope的id。

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

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

相關(guān)文章

  • Angularjs學(xué)習(xí)筆記指令

    摘要：自定義指令中有很多內(nèi)置指令，一般都是以開(kāi)頭的比如等等。本文介紹的自定義指令的用法。該參數(shù)的意思是替換指令的內(nèi)容，更改上面的例子。將屬性綁定到父控制器的域中學(xué)習(xí)概念多指令中的參數(shù)中增加了的值和的點(diǎn)擊函數(shù)。 自定義指令 angularjs中有很多內(nèi)置指令，一般都是以ng開(kāi)頭的；比如：ng-app,ng-click,ng-repeat等等。本文介紹angularjs的自定義指令的用法。 指令...

    LeexMuller 評(píng)論0 收藏0

  • Angularjs學(xué)習(xí)筆記指令

    摘要：自定義指令中有很多內(nèi)置指令，一般都是以開(kāi)頭的比如等等。本文介紹的自定義指令的用法。該參數(shù)的意思是替換指令的內(nèi)容，更改上面的例子。將屬性綁定到父控制器的域中學(xué)習(xí)概念多指令中的參數(shù)中增加了的值和的點(diǎn)擊函數(shù)。 自定義指令 angularjs中有很多內(nèi)置指令，一般都是以ng開(kāi)頭的；比如：ng-app,ng-click,ng-repeat等等。本文介紹angularjs的自定義指令的用法。 指令...

    Cristic 評(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 評(píng)論0 收藏0

  • 理解和學(xué)習(xí)AngularJS（一）

    摘要：為指令賦值函數(shù)名，即可運(yùn)行。它也是一個(gè)對(duì)象，指向應(yīng)用程序作用域內(nèi)的所有元素和執(zhí)行上下文。簡(jiǎn)而言之，是與指令元素相關(guān)聯(lián)的當(dāng)前作用域，可以理解為視圖和控制器間的一個(gè)通道。它們被組織為模塊形式，之后可以被另一個(gè)引用。 Angularjs Angular是一款主旋律的MVVM框架，框架和傳統(tǒng)的庫(kù)不同： 類(lèi)庫(kù)是一些函數(shù)的集合，它能幫助你寫(xiě)WEB應(yīng)用。起主導(dǎo)作用的是你的代碼，由你來(lái)決定何時(shí)使用類(lèi)...

    EastWoodYang 評(píng)論0 收藏0

  • angularjs學(xué)習(xí)筆記—指令input

    摘要：新增的日期選擇器。類(lèi)型必填必填最小長(zhǎng)度最大長(zhǎng)度正則匹配正則匹配更新觸發(fā)即使沒(méi)有使用校驗(yàn)屬性，只要數(shù)據(jù)不符合格式，就會(huì)被更新成。 input[text] input一般和ngModel結(jié)合使用來(lái)實(shí)現(xiàn)雙向綁定，同時(shí)angular提供了很多表單校驗(yàn)的指令 required 必填 ngRequired 必填（ngRequired可以控制是否是必填校驗(yàn)） ngMinlength 最小長(zhǎng)度...

    princekin 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

閱讀需要支付1元查看
<