我有一个 AngularJS 应用程序,我认为它本质上是非常典型的(就像许多示例一样)。
<html ng-app="myApp" ...
<body>
...
<div class="main" ng-view></div>
...
$routeProvider
我已经设置了很多swhen
来将用户引导到视图(带有控制器的模板部分),例如:
$routeProvider.when('/incident/:identifier', {templateUrl:'incident.html', controller:"IncidentCtrl"});
这一切都很好。用户可以在视图之间来回切换。
现在,假设我对“事件”有一个看法。它具有具有“事件”属性的形式。(您可以更改表单和“保存”中的值,这不是这里的重点。)我有以下要求:
- 现有表单下方的“添加工单”按钮
- 单击按钮时,将在现有表单下方加载一个表单(部分)以输入新“工作订单”的详细信息
- “保存”按钮作为加载表单的一部分(部分)将保存新的“工单”
- 表单(部分)关闭、卸载或至少在视觉上移除
- 可能回到 2. 重复(添加后续的“工单”)
对于在现有表单下方加载的表单,我想重用现有模板部分及其后续控制器,我已经将其用于ng-view
其他地方的顶层。但是我走了几条路来实现这一点无济于事;ng-include
似乎不起作用,因为它是相当静态的,并且不允许嵌入元素的大部分生命周期。此外,动态加载它似乎很困难,这意味着它会在“添加工作订单”按钮被点击之前加载。有人能指出一个可行的策略吗?显然,我的目标是促进现有模板部分和控制器的重用,而不总是让用户在视图之间移动。非常感激。
ng-include
编辑:详细说明:我对迄今为止看到的任何想法都不满意,因为:
- 如果我要嵌入的不仅仅是一种视图,就会有很多这样的视图。他们都会在没有充分理由的情况下被加载。矫枉过正
- 我不知道如何以与
$routeParams
从$routeProvider
- 我对父子范围之间的过多共享感到不舒服
- 我无法为后续的“添加”干净地重新创建控制器