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 ，以确定它是否应该显示，并包含更多的模板加价显示的顺序或任何和管理它的逻辑。