angular-directive

问题 I recently have started to learn Angular 2 and I am struggling to understand how I should properly connect the changes that occurred in outside world to Angular Reactive Forms. Specifically, I have an issue with the following example: I want to create a directive that enhances input with autocomplete functionality that provided by typeahead jQuery plugin. My directive looks like the following: @Directive({ selector: '[myTypeahead]' }) class TypeAheadDirective implements AfterViewInit {

问题 i'm trying to build a structural directive that will change the parent DOM structure either invoked by using its selector (static) or by calling its public method(dynamic). Using the directive selector in a html template works fine without any issues. I'm trying to figure out if we an achieve the same without using it in template and by calling the directive method. my-directive.ts @Directive({ selector: '[sampleDirective]' }) export class SampleDirective { ... constructor(..) { this

问题 Here is the code that I have <parent my-directive [toHide]="childRef"> <child bottom right #childRef> <button>Some text </button> </child > </parent > Here I have my-directive on the parent element and I want to access the child and apply some style to it. So in my directive, I have the following. export class MyDirective { @Input("toHide") localRef; constructor(public element:ElementRef,public renderer:Renderer) { console.log('Hello MyDirective Directive'); } ngAfterViewInit() { console.log(

问题 I'm fairly new to Angular. I have a form where the user need to assign port numbers to 9 different port input fields (context: it's a form for a server environment configuration). The validation requirement is that no port number can be assigned twice, so each of the 9 port numbers needs to be unique. For that, I have a custom validation directive called "srb-unique-port", which I assign to my input fields. Directive: (function () { 'use strict'; angular .module('account') .directive(

问题 Here is my Plunker The above Plunker is a basic example for connecting the nodes followed by the Links. I would like to update my Plunker directive in order to add the SpacingZoom. Here is the example The example is given for SpacingZoom in GoJS official website using javascript. I want that to be converted into an angular directive. Here is my code scripts.js var app = angular.module('app', []); app.directive('goDiagram', function($http) { return { restrict: 'E', template: '<div></div>',

问题 I have a directive element: return { restrict: 'E', replace: true, transclude: true, template: '<ul>' + '<li {{myNewAttrDirective}}>Home</li>' + '<li {{myNewAttrDirective}}>Products</li>' + '<li {{myNewAttrDirective}}>Cart</li>' + '<li {{myNewAttrDirective}}>Contact Us</li>' + '</ul>', scope: { _showMore : '=showMore' }, link: function(scope, element, attrs) { if (scope._showMore === true) { scope.myNewAttrDirective = 'myAnimationDirective' } } }; HTML: <my-directive show-more="true"></my

问题 I have been trying to create a very simple directive that checks if the attribute my-minlength is a string (not null) and if it is; add the attribute ng-minlength to the input element. I feel like this should work, but it is simply not working. My Directive var app = angular.module("fooApplication", []) app.directive('myMinlength', function() { return { link: function(scope, element, attrs) { if(element == "") { attrs.$set('ng-minlength', attrs.myMinlength); } }, } }); My HTML <input type=

问题 I am using AngularJS with ui-router. I am attempting to make use of the AngularJS PDF directive available at https://github.com/sayanee/angularjs-pdf. I'm having to make some changes to the example given because I do not have the URL to the PDF right off the bat. However, I ran into a problem. Because I pass an id value associated with the PDF into the route, I have to wait to resolve that parameter until the route change has been successful. I accomplished this with the guidance at https:/

问题 I've based a phone number formatting directive on this gist. Everything generally works great. But if I add a ng-minlength or ng-maxlength validation requirement, the input won't accept any input at all. .directive('phonenumberDirective', ['$filter', function($filter) { function link(scope, element, attributes) { scope.inputValue = scope.phonenumberModel; scope.$watch('inputValue', function(value, oldValue) { value = String(value); var number = value.replace(/[^0-9]+/g, ''); scope

问题 What is the correct way to update the values of a particular index. I have custom drag and drop and a "area" within within which the elements can be dragged and dropped and moved inside that "area" =>the div having class dropzone. I also want to interpolate the current x and y positions of the element being moved within the the "area". I calculate the positions and I want to update the interpolated values to the latest one in the below code. But when I update the values using the if/else if