AngularJS多次設置同一個ngapp

Question

我遇到的問題是我需要根元素作為錨標記，然后在錨標記下需要div。 他們都將使用屬於同一應用的相同角度控制器。 vm.Open上的databind可以在anchor標記內找到，但在div標記內則無法工作。 div標簽如何與控制器“ ordercontrol”一起引導為“ app”？ 現在我有：

我的HTML

<a data-ng-app="app" data-ng-controller="ordercontrol as vm" href="#" data-ng-click="vm.Open = !vm.Open">{{vm.Open}}</a>

<div data-ng-app="app" data-ng-controller="ordercontrol as vm" id="QuickOrderDiv">
    <div class="row">
        {{vm.Open}} //showing as '{{vm.Open}}' inside page
    </div>
</div>

Answer 1

根據AngularJS文檔 ，每個HTML文檔只能引導一個應用程序。 您可能沒有充分的理由嘗試在一個文檔中聲明和使用多個應用程序。 根據您的意圖，有幾種方法可以進行。

首先，請記住：將控制器分配給元素（使用ng-controller指令）會創建一個從父級繼承的新作用域 。 在該范圍內使用的所有元素，指令和其他控制器都可以使用該控制器共享功能。 因此，從本質上講，控制器用於集中特定於應用程序和視圖的模型和應用程序邏輯（例如，應用程序中的任何功能任務，例如訂單或登錄頁面；這些由控制器提供服務） ）。

如果您想在整個應用程序中多次重復使用某個行為 ，並且該行為並非特定於您的應用程序中的特定視圖（例如組件，例如日期選擇器或購物車狀態圖標/鏈接），您可能希望將邏輯封裝在指令中 。

現在，存在一些重疊（例如，指令可以具有自己的作用域或控制器），並且何時使用一個或另一個可能會造成混淆。 如上所述，控制器主要用於包含應用程序中視圖的業務邏輯。 指令是更正交的，封裝的模板和邏輯，它們可以：a）您可以輕松地在應用程序中的視圖之間重用，b）擴展現有HTML元素，使其具有更豐富的標記和編程行為。 您可以使用服務（它是單實例對象）來協調控制器和指令之間的數據。

考慮到每個文檔只能有一個ng-view元素，新開發人員面臨的另一個常見問題是獨立維護或繼承不同的狀態。 在這種情況下，請考慮ui-router 。

我胡亂猜測你的情況，你可能需要某種QuickOrder指令其結合到一個值OrderController ，以確定它是否應該顯示，並包含更多的模板加價顯示的順序或任何和管理它的邏輯。