jquery - AngularJS 旁边的次要图像编辑功能

Question

如果我有一个启用 AngularJS 的网页，添加一些浅色图像分层、缩放和定位（在特定框中）功能的最佳选择/约定是什么？

我是否开始为我需要的“控件”添加 jquery，还是有更好的方法？

Answer 1

您可以使用 jQuery，但它不仅仅是一种角度的方式。如何为您的控件创建指令并在单击时调用其中一个控制器方法。

HTML：

<div ng-app="Images">

    <div ng-controller="imagesfilter"> 
        <button filter="lighten">Lighten image</button> 
    </div>

</div>

应用程序.js

var Images = angular.module('Images', []);

指令.js

Images.directive("filter",function(){
    var filter = function(scope,element,attrs) {
        element.bind('click',function(e){
                    e.preventDefault();
                    //calls lighten method on controller
                    scope.$apply(attrs.type); 
                    // if you need to apply any css you can access element here too
        });
    };
    return filter;
});

控制器.js

Images.controller('imagesfilter',['$scope', function ($scope) {
     $scope.lighten = function() {
         // your lighten code here.
     };
}]);