AngularJS中Scope間通訊Demo

2021-09-07 22:37:45 字數 1506 閱讀 5867

在angularjs中,每乙個controller都有對應的scope,而scope間有時候需要通訊。比如有如下的乙個controller巢狀:

<

body

ng-controller

>

<

table

ng-controller

= "productctrl"

>

...

<

tr ng-repeat

="product in products"

>

<

td>}

td>

<

td>}

td>

<

td>}

td>

<

td><

button

ng-click

="addtocart(product)"

>新增到購物車

button

>

td>

tr>

table

>

<

div

ng-controller

="cartctrl"

>

...

<

tr ng-repeat

="product in cart"

>

<

td>}

td>

<

td>}

td>

<

td>}

td>

<

td><

button

ng-click

="removefromcart(product)"

>remove

button

>

td>

tr>

div>

body

>

對應的controller部分大致是:

($scope))

($scope),

...];

$scope.addtocart = function

()});

($scope)

});

($scope, $rootscope),

...];

$scope.addtocart = function

(product)})

可見,$rootscope通過$broadcast方法廣播事件,乙個實參是事件名稱,乙個實參是要傳遞的物件。

→ 在cartctrl中需要偵聽來自$rootscope的事件,同時要把移除product的事件告知更高階別的scope

($scope)

$scope.removefromcart = function

(product)})

($scope))})

可見,也是通過$on方法偵聽子$scope中emit發出的事件。

AngularJs中的作用域Scope

作用域 scope index.html your name greet script.js function mycontroller scope 控制器 mycontroller,它引用了 scope並在其上註冊了兩個屬性和乙個方法 scope 物件 持有上面例子所需的資料模型,包括userna...

spring中scope作用域

今天研究了一下scope的作用域。預設是單例模式,即scope singleton 另外scope還有prototype request session global session作用域。scope prototype 多例。再配置bean的作用域時,它的標頭檔案形式如下 接著既可以配置bean的...

spring中的屬性scope

之前在開發過程中遇到了乙個問題,當request發起下乙個請求的時候,action中的屬性值並沒有清除,而是繼續採用上次使用過的引數值進行查詢並響應,導致資料查詢不真實或失敗。對此,有同事告訴我說,需要在spring配置檔案的bean中新增屬性scope prototype。結果還真的有用。下面是我...