Dan*_*Que 2 model-view-controller angularjs
我在与"可突出显示的图像"有关的指令中有代码.目标是能够在图像上创建高光并为其附加注释.因此,当您单击图像时,它会创建一个注释.
我在控制器中有一个工具提示工具栏的代码,您可以使用它将注释附加到注释.目前,当按下此工具栏上的"注释"按钮时,信息将存储到数据库中.如果单击工具栏上的"取消",则应删除突出显示.
我的困境是我不确定如何构建符合MVC设计模式的东西.具体来说,单击取消发生在工具栏中,但必须影响突出显示(由指令管理).单击注释必须调用服务才能修改数据库.
我已经考虑过将工具栏代码移动到指令中,但另有决定,因为指令不应该处理后端.理想情况下,工具栏应该在其自己的指令中.我想知道你认为"正确"的做法是什么.
根据您描述的功能,
创建服务:
highlightImageService(这将使用$ http服务将数据持久保存到数据库中)
创建一个控制器:
highlightImageController
在您的指令中,指定您的控制器并注入您的服务:
.directive('imageHighlighter', function(highlightImageService) {
restrict: ...
scope: ...
controller: highlightImageController,
link: function(scope, element, attr, controller) ...
})
将所有内容组合在一个模块中:
var module = angular.module('imageHighlighter', [...]);
module.controller(highlightImageController);
module.directive(imageHighlighter)
module.factory(highlightImageService);
由于模块(指令,控制器,服务)中的所有内容都是自包含的,因此使用模块所需要做的就是将其添加为模块依赖项并向页面添加指令:
脚本:
var app = angular.module('app', ['imageHighlighter']);
HTML:
<body ng-app="app">
<div image-highlighter></div>
</body>
| 归档时间： |
|
| 查看次数： |
346 次 |
| 最近记录： |