angularjs-directive

问题 I want to create a directive that links to an attribute. The attribute specifies the function that should be called on the scope. But I also want to pass an argument to the function that is determined inside the link function. <div my-method='theMethodToBeCalled'></div> In the link function I bind to a jQuery event, which passes an argument I need to pass to the function: app.directive("myMethod",function($parse) { restrict:'A', link:function(scope,element,attrs) { var expressionHandler =

问题 This question already has answers here : duplicate ajax calls in angularjs (2 answers) Closed 2 years ago . After adding headers inside code duplicate call is happening. find the image to see the call happening twice. auth-interceptor.ts export class AuthInterceptor implements HttpInterceptor { intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> { const clonedRequest = req.clone({ headers: req.headers.set('X-CustomAuthHeader', 'some-auth-token') }); console.log(

问题 I wanted to use on-drag-start as an attribute in AngularJS directive, called ngDraggable . However, it seems not possible to have that attribute. The following code is in pure javascript, and I can get on-drag-start as an attribute. I think I can get any attribute regardless of attribute name. <h1 id="tag1" on-drag-start="START" on-drag="DRAG" on-drag-end="END" >Hello Plunker!</h1> Attributes in pure javasctipt DEMO: http://plnkr.co/edit/6iODSnf56KtwPFpoC7ck?p=preview However, in the

问题 Hope any angularjs gurus can help me with this.Here is my angularjs code $scope.$on('$routeChangeStart', function(event, next, current) { if ($scope.myForm.$dirty) { if(!confirm("Unsaved, do u want to continue?")) { event.preventDefault(); } } }); It alerts in browser back button click when data is dirty, but on clicking cancel or ok it still completes the route change.Seems like event.preventDefault() is not working. Can any one point out what may be wrong 回答1: I had lots of trouble finding

问题 So I have a directive with isolate scope and a controllerAs pattern. var directive = { restrict: 'E', scope: { something: '=' }, templateUrl: './App/directiveTemplate.html', controller: directiveController, controllerAs: 'vm', bindToController: true } and in the controller I init with a call to a REST service using $http that returns a promise. function directiveController(someService) { var vm = this; // Here vm.something is defined and bound to the appropriate model set where the directive

问题 Update : It must have been something stupid in another part of the code. It works now, so the bindToController syntax is fine. We are using AngularJS 1.4, which introduced a new way to use bindToController in directives. After quite a bit of reading (and maybe not understanding everything), we defined our directive like this: .directive('mdAddress', function mdAddress() { var directive = { restrict: 'EA', scope: {}, bindToController: { address: '=' }, templateUrl: 'modules/address/address

问题 I've got a few custom directives that use jQuery for animation effects (angular's built-in ngShow/ngHide and the like are functional, but not pretty). I think I remember reading in the documentation somewhere that angular has its own DOM selector (something like angular.export() or angular.select() ) that I should use instead of $(SELECTOR) ; however I can't find it now. I'm doing something like this: //view <div scroll-to="element"> //`element` is set via ng-click … </div> //directive link:

问题 How can i be notified when a directive is resized? i have tried element[0].onresize = function() { console.log(element[0].offsetWidth + " " + element[0].offsetHeight); } but its not calling the function (function() { 'use strict'; // Define the directive on the module. // Inject the dependencies. // Point to the directive definition function. angular.module('app').directive('nvLayout', ['$window', '$compile', layoutDirective]); function layoutDirective($window, $compile) { // Usage: // //

问题 I am trying to dynamically add different directives in an ng-repeat however the output is not being interpreted as directives. I've added a simple example here: http://plnkr.co/edit/6pREpoqvmcnJJWzhZZKq Controller: $scope.colors = [{name:"red"}, {name: "blue"}, {name:"yellow"}]; Directive: app.directive("red", function () { return { restrict: 'C', template: "RED directive" } }); Html: <ul> <li ng-repeat="color in colors"> <span class="{{color.name}}"></span> </li> </ul> How do I make angular

问题 Why in the following example the initial rendered value is {{ person.name }} rather than David ? How would you fix this? Live example here HTML: <body ng-controller="MyCtrl"> <div contenteditable="true" ng-model="person.name">{{ person.name }}</div> <pre ng-bind="person.name"></pre> </body> JS: app.controller('MyCtrl', function($scope) { $scope.person = {name: 'David'}; }); app.directive('contenteditable', function() { return { require: 'ngModel', link: function(scope, element, attrs, ctrl) {