我正在使用angular创建一个指令,并且我正在使用kendo-window
控件。现在我想按照控制器的要求打开那个kendo窗口。简单来说,我想在点击按钮时调用来自directive
的{{1}}方法。
这是我的代码示例
controller
HTML
sample.directive('workorderwindow', [initworkorderwindow]);
function initworkorderwindow() {
return {
link: function (scope, elements, attrs) {
},
restrict: 'E',
template: "<div data-kendo-window='window.control' data-k-options='window.config'> HELLOW RORLD </div>",
scope: {
},
controller: function ($scope) {
$scope.window =
{
control: null,
config: { title: 'HELLO WORLD', visible: false }
}
$scope.open = function () {
$scope.window.control.center().open();
}
}
}
}
现在我想从我的控制器调用该指令open方法。
<workorderwindow></workorderwindow>
答案 0 :(得分:1)
从控制器直接调用指令的函数可能是一种不好的做法。您可以做的是创建一个服务,从您的控制器调用它并在您的指令中注入此服务。使用$ watch,您将能够触发指令功能。
Controller和Directive之间的服务
app.factory('myWindowService', function () {
return {
windowIsOpen : null,
openWindow: function () {
this.windowIsOpen = true;
},
closeWindow: function () {
this.windowIsOpen = false;
}
};
您的指示:
app.directive('workorderwindow', function () {
return {
restrict: 'E',
template: "<div>test</div>",
controller: function ($scope, myWindowService) {
$scope.windowService = myWindowService;
$scope.$watch("windowService.windowIsOpen", function (display) {
if (display) {
console.log("in directive");
//$scope.window.control.center().open();
}
// You can close it here too
});
}
};
})
并从您的控制器中调用它
app.controller('datacontroller', function ($scope, myWindowService) {
$scope.open = function () {
myWindowService.openWindow();
}
// $scope.close = ...
});
这是一个有效的小提琴http://jsfiddle.net/maxdow/ZgpqY/4/