欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

詳解Angular.js指令中scope類型的幾種特殊情況

 更新時(shí)間:2017年02月21日 08:44:48   作者:xishiyi7  
AngularJs最重要也是最難理解的模塊之一就是它的指令(directive)了,自定義指令配置有很多個(gè)參數(shù),下面這篇文章主要介紹了關(guān)于Angular.js指令中scope類型的幾種特殊情況,需要的朋友可以參考下。

前言

大家都知道在默認(rèn)情況下,指令應(yīng)該訪問父作用域.如果我們對(duì)指令暴露了父控制器的scope,那么指令就可以自由的修改scope屬性.在一些情況下,你的指令可能想要添加一些只有內(nèi)部可以使用的屬性和函數(shù),如果我們都在父作用域中完成,可能會(huì)污染了父作用域,因此,我們有以下兩種選擇:

使用父作用域-如果不需要操作父作用域?qū)傩?不需要一個(gè)新的作用域,可以直接使用父作用域

scope:false

一個(gè)子作用域-這個(gè)作用域會(huì)原型繼承父作用域

scope:true

一個(gè)隔離的作用域-一個(gè)全新的、不繼承、獨(dú)立存在的作用域

scope:{}

作用域可以由指令定義對(duì)象中的scope屬性定義,下面是關(guān)于scope屬性的一些說明:

指令中的scope常見的類型

=

  1. '=',用于子作用域與父作用域雙向綁定.使用這種方法可以將一個(gè)實(shí)際的作用域模型賦值給一個(gè)屬性,而不是一個(gè)普通的字符串.效果是你可以傳遞復(fù)雜的數(shù)據(jù)模型,例如數(shù)組/對(duì)象等到隔離作用域.父作用域或者子作用域?qū)傩园l(fā)生了改變,會(huì)相應(yīng)影響對(duì)方.
  2. '=?',這種情況可以避免父作用域?qū)傩灾胁淮嬖诋?dāng)前屬性情況,避免拋出異常.--'If the parent scope property doesn't exist, it will throw a NON_ASSIGNABLE_MODEL_EXPRESSION exception. You can avoid this behavior using `=?` or `=?attr` in order to flag the property as optional.'
  3. '=*',If you want to shallow watch for changes (i.e. $watchCollection instead of $watch) you can use `=*` or `=*attr` (`=*?` or `=*?attr` if the property is optional).

&

  1. '&',用于執(zhí)行父作用域中的函數(shù).

@

  1. '@',進(jìn)行單項(xiàng)文本綁定.使用這種方法可以將字符串傳遞到屬性,當(dāng)父作用域?qū)傩园l(fā)生變化時(shí),隔離作用域模型也發(fā)生變化.然而,反之則不成立!你不能通過操縱隔離作用域來改變父作用域.

總結(jié)

以上就是這篇文章的全部內(nèi)容了,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來一定的幫助,如果有疑問大家可以留言交流,謝謝大家對(duì)腳本之家的支持。

相關(guān)文章

  • Angular6實(shí)現(xiàn)拖拽功能指令drag實(shí)例詳解

    Angular6實(shí)現(xiàn)拖拽功能指令drag實(shí)例詳解

    這篇文章主要為大家介紹了Angular6實(shí)現(xiàn)拖拽功能指令drag實(shí)例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
    2023-11-11
  • 詳細(xì)談?wù)凙ngularJS的子級(jí)作用域問題

    詳細(xì)談?wù)凙ngularJS的子級(jí)作用域問題

    大家在使用angularjs的時(shí)候,很容易忽略AngularJS自帶指令的作用域問題,有一些指令會(huì)產(chǎn)生獨(dú)立的自己作用域,造成子級(jí)無法與父級(jí)作用域雙向綁定的問題。下面我們來看看這些問題,有需要的可以參考借鑒。
    2016-09-09
  • 使用AngularJS制作一個(gè)簡單的RSS閱讀器的教程

    使用AngularJS制作一個(gè)簡單的RSS閱讀器的教程

    這篇文章主要介紹了使用Angular.js制作一個(gè)簡單的RSS閱讀器的教程,AngularJS是一個(gè)非常有人氣的JavaScript庫,文中介紹的制作方法主要使用到了FreedReadR模版,需要的朋友可以參考下
    2015-06-06
  • 舉例簡介AngularJS的內(nèi)部語言環(huán)境

    舉例簡介AngularJS的內(nèi)部語言環(huán)境

    這篇文章主要介紹了AngularJS的內(nèi)部語言環(huán)境,展示不同語言環(huán)境下對(duì)貨幣或是日期等文本方面所產(chǎn)生的影響,需要的朋友可以參考下
    2015-06-06
  • angular學(xué)習(xí)之從零搭建一個(gè)angular4.0項(xiàng)目

    angular學(xué)習(xí)之從零搭建一個(gè)angular4.0項(xiàng)目

    本篇文章主要介紹了從零搭建一個(gè)angular4.0項(xiàng)目,主要用到的工具angular4.0、angular-cli、npm(v3.10.8)、node(v6.2.0),有興趣的可以了解一下
    2017-07-07
  • 深入淺析AngularJS和DataModel

    深入淺析AngularJS和DataModel

    這篇文章主要介紹了深入淺析AngularJS和DataModel 的相關(guān)資料,需要的朋友可以參考下
    2016-02-02
  • 詳解Angular調(diào)試技巧之報(bào)錯(cuò)404(not found)

    詳解Angular調(diào)試技巧之報(bào)錯(cuò)404(not found)

    本篇文章主要介紹了詳解Angular調(diào)試技巧之報(bào)錯(cuò)404(not found),小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧
    2018-01-01
  • AngularJS中ng-class用法實(shí)例分析

    AngularJS中ng-class用法實(shí)例分析

    這篇文章主要介紹了AngularJS中ng-class用法,結(jié)合實(shí)例形式分析了ng-class的功能、使用方法與相關(guān)注意事項(xiàng),需要的朋友可以參考下
    2017-07-07
  • AngularJS通過$sce輸出html的方法

    AngularJS通過$sce輸出html的方法

    不知道大家有沒有發(fā)現(xiàn)在用AngularJS作為前端搭建個(gè)人博客的時(shí)候,發(fā)現(xiàn)用AngularJs輸出html的時(shí)候,瀏覽器并不解析這些html標(biāo)簽,這里我們需要其顯示angular輸出的html能被瀏覽器解析怎么辦呢?不知道Angularjs如何實(shí)現(xiàn)這種功能的通過這篇文章來看看吧。
    2016-09-09
  • AngularJS學(xué)習(xí)筆記之ng-options指令

    AngularJS學(xué)習(xí)筆記之ng-options指令

    ng-options是angular-1.3新出的一個(gè)指令,這篇文章就來介紹這個(gè)指令的用法.有需要的小伙伴可以參考下。
    2015-06-06

最新評(píng)論