0

我正在创建一个单页 Web 应用程序，该应用程序具有一个用于整个页面（PageController）的控制器和用于两个视图（ViewController 和 EditController）的单独子控制器。

ViewController 在应用程序的标题栏中需要一个名为“Edit”的按钮，EditController 需要一个名为“Save”的按钮。这些按钮占据相同的空间，但具有不同的标签和不同的点击处理程序。标题栏属于父模板/控制器（即 PageController）范围。

实现此目的的一种方法是在父范围内创建按钮并让子控制器更改文本并覆盖 ng-click 处理程序 - 但我认为 Angular 可能有更好的方法。我想要一些方法让子控制器“注入”（不确定这是否是正确使用这个词）他们的按钮到父模板并在本地处理 onclick，使父不知道发生了什么子控制器...

4

1 回答 1

0

我会以不同的方式考虑您的“观点”。对我来说，标题栏是一个视图，就像你的视图和编辑视图一样。因此，它应该包含渲染您可能希望在该视图中显示的任何内容所需的所有 HTML，或者它应该知道要 ng-include 哪些文件。

视图由模型驱动。View 和 Edit 控制器应该调用在包含标题栏模型的任何控制器（或服务）上定义的方法，以适当地设置一些状态/属性。标题栏视图/HTML 将使用 ng-show/hide 或 ng-include 指令根据模型/$scope 的当前状态显示/包含适当的 HTML。

要在按钮单击时收到通知，查看和编辑范围可以 $watch 模型/$scope 属性以进行更改。例如， <a ng-click="buttonState.clicked=true">...</a> 我正在使用一个具有clicked属性的对象，以便子控制器可以重置其 $watch 回调中的值（如果使用了原语，则重置将不起作用——将创建一个新的子范围属性）：

$scope.$watch('buttonState.clicked', function() {
   buttonState.clicked = false
   ... handle button click here ...
}
于 2013-02-18T23:00:18.470 回答