在控制器範圍內使用指令時不保留$ scope

在我的代碼中，我有兩個指令。一個在控制器範圍內，另一個不在html部分。

<div ng-show="isStore==true"> 
       <packgroup-directive> 
       </packgroup-directive> 
       <div class="lineBreaker" ng-if="groupList.length>0"></div> 
       <div ng-controller="WalletController"> 
        <outfit-directive></outfit-directive> 
        <div class="imageContainer" ng-show="getPurchaseState() == false" ng-click="buyAllOutfit()"> 
         <img class="feature1" ng-src="/app/app_resources/language/en/resources/{{buyAllOutfitBanner}}"/> 
         <div class="buttonBanner">{{allOutfitBannerValue}} 
         <img style="width: 20%" ng-src="/app/app_resources/icons/pep_sign_black.png"></div> 
        </div> 
       </div>

這裏packgroup-directive不被外部具有控制器標籤和outfit-directive是WalletController標記內。

所以我面臨的問題是我有一個變量popupopen，它控制彈出窗口的關閉。在我的控制器我調用此函數從另一個JS文件：

$scope.checkPopup = function(){ 
     if(popupOpen==1 && dialogID!=null){ 
     ngDialog.close(dialogID); 
     ngDialog.close($scope.dialogID); 
     bridge.getPopupState("0"); 
     } 
    }

這個功能是從其他JS文件調用，但更新後的值只顯示爲packgroup directive而不是爲outfit-directive，但是當我從刪除WalletController標記它顯示正確的值。

代碼：https://jsfiddle.net/x1x1ug5y/

來源

2017-11-25 arqam

你可以請添加您的指令和控制器？謝謝 – lin

@lin添加了代碼。 – arqam

你小提琴不能運行。請刪除這些錯誤以重現您的問題。 – lin

的問題是，你有兩個獨立的範圍。一個是父（由packgroup使用），另一個是子（由WalletController使用）。因此，爲了達到所需的行爲，您需要在它們之間共享數據。這可以通過下面的方法完成：

把你的變量放到$ rootScope中，並從子控制器的$ rootScope中獲得這個變量。優點：simle; 缺點：污染全球範圍是一個壞主意。
使用事件發射方法。在父範圍內，處理變量更改並廣播此值。子控制器將捕獲並更新。優點：簡單; 缺點：直接事件方法使您的應用程序更難以調試和維護。（恕我直言）
使用特殊服務在控制器之間共享數據。最常見的方法。優點：清除共享數據的方式缺點：需要更多代碼
使用組件並將數據作爲參數傳遞給子控制器優點：更清晰的共享數據的方式。缺點：需要角1.5和一點點時間才能返工。
解決方法。將您的變量定義爲：$ scope.popup = {isOpen：false}，然後嘗試在子控制器上獲取此對象（不是isOpen字段）。由於$範圍的繼承，這也可以工作。優點：簡單; 缺點：獲取變量會導致您的應用程序難以理解，並可能導致意外的錯誤。

希望這會有所幫助。你也可以閱讀這個article

來源

2017-11-25 11:42:22 Vitalii

我試過用$ scope.popup = false/true，但是在那種情況下它不起作用。將創建一個對象的幫助？ – arqam

它應該，所以你可以試試看。但我會建議使用這種服務。這會稍後好得多。 – Vitalii

服務如存儲在本地存儲或正常服務功能？ – arqam

在控制器範圍內使用指令時不保留$ scope

回答

相關問題