Search Posts

Category: angular2-directives

Angularjs advance search

I’m having the above user interface and when i type site name it will display all the names of the sites specifying the name which i search and i can select the one which i want and set the value to the text box after that i want to get the particular siteid to the other text box from database by clicking the button Site A/ Name <input type=’text’ ng-keyup=’fetchUsers()’ ng-model=’searchText’ placeholder=’Search Site by name’><br> […]

AngularJS directive for Progress Flow

looking for some advice on if there are any existing AngularJS directives for a progress flow like this: The closest things I’ve come across are progress bars, which are mostly shown for things loading or updating. I want to code something that shows Stages and the progress to completion. Any ideas or suggestions? Source: AngularJS

How to pass dynamic value in jquery plugin attributes

I am using numscroller.js and have passed the dynamic value in jquery button click, but it’s not working. Jquery Library: <p> <button>Counter</button> <span id=”myPercents”><span class=’numscroller’ data-min=’1′ data-max=’50’ data-delay=’3′ data-increment=’1′>&nbsp;&nbsp;</span>%</span> </p> $(“button”).click(function(){ alert(‘2’); $(“.numscroller”).attr(“data-min”, ‘1’); $(“.numscroller”).attr(“data-max”, ‘500’); }); and Another question can i able to pass the value from angular component. import { Component ,OnInit} from ‘@angular/core’; declare var $:any; @Component({ selector: ‘app-root’, templateUrl: ‘./app.component.html’, styleUrls: [‘./app.component.css’] }) export class AppComponent implements OnInit{ totalvisitors = […]

*ngIf Angular directive

I need to move a project out of angular, and thus need to change many of the directives i’ve been using. I was wondering if anyone knew what I could change the *ngIf directive to in plain javascript? example: <li *ngIf=”currentLanguage !== ‘en'”><a onClick=”changeLanguage(‘en’) “hreflang=”en”><img class=”flag” src=”assets/languages/en.png” alt=””>{{‘NAVIGATION_EN’|translate}}</a></li> Source: AngularJS

ngClass does not update DOM in Promise Callback

I have a Rating Component (Angular) as follows: import { Component, ChangeDetectionStrategy, Input, NgZone, ApplicationRef} from ‘@angular/core’; import { Icon } from ‘ionic-angular/components/icon/icon’; import { Events } from ‘ionic-angular’; // import { ImageService } from ‘../../providers/image-service/image-service’; // @Component({ selector: ‘rating’, providers: [Icon], templateUrl: ‘rating.html’, changeDetection: ChangeDetectionStrategy.OnPush }) export class RatingComponent { static readonly RATING_CHANGE: string = ‘ratings-changed’; text: string; private tempscore: number = 0; // @Input() public score: number = 0; @Input() public max: number […]

custom directive not working in future element in angular4

I have made a custom directive in angular 4 and it is using in future html element. But its not working. Below are code example. HTML added in future. (removeTag is attribute) var html = ‘<span _ngcontent-c3 removeTag class=”tag-r”>’; html += ‘<input type=”hidden” name=”con_tags[]” value=”‘ + txt + ‘” />’; html += txt + ‘</span>’; this.elRef.nativeElement.insertAdjacentHTML(‘beforebegin’, html); removeTag Directive code @Directive({ selector: ‘[removeTag]’ }) export class removeTagDirective { constructor( private elRef: ElementRef, private renderer: Renderer2) […]

Angular 2 ag-grid’s Clear Filter button clears the textbox without refreshing column when built-in filter is used

When ag-grid’s default filter is enabled, the clear filter button only clears the text box and doesn’t refresh the column even though ‘clearButton’ and ‘applyButton’ params are set to true. After clicking the Clear filter button the text gets cleared from the textbox and I have to actually click Apply Filter button to remove the filter and refresh the column. Below is my code: result.filter = “date”; result.filterParams = { applyButton: true, clearButton: true }; […]

How to use value of click function of addEventListener in another function?

I want to use value of a click function in another function using angular 2. My code is written below : optionFn(id){ let root = this.viewCtrl.instance.navCtrl._app._appRoot; // console.log(root); document.addEventListener(‘click’, function (event) { let btn = document.querySelector(‘.remove-ok .alert-button-default:nth-child(2)’); let target =; if (btn && target.className == ‘alert-radio-label’) { let view = root._overlayPortal._views[0]; let inputs = view.instance.d.inputs; console.log(“inputs” + JSON.stringify(inputs)); for(let input of inputs) { let input = inputs_1[_i]; if (input.checked) { // this.optionEvent1 =input.value; view.instance.d.buttons[1].handler([input.value]); […]

Angular 2, Using Jquery to Manipulate Bootstrap

I’m pretty new with NG2, and I’m trying to add Slide Up/Down effects do default Bootstrap 4 Dropdown component. The Bootstrap dropdown component has 2 Jquery Listeners $(el).on(‘’) and $(el).on(‘’). So I created a directive to add this effects: import { Directive, OnInit, AfterViewChecked, ElementRef, Input } from ‘@angular/core’; import * as $ from ‘jquery’; @Directive({ selector: ‘[appDropDownAnimate]’ }) export class DropDownAnimateDirective implements AfterViewChecked { @Input() appDropDownAnimate: boolean; private el = this.ElementRef.nativeElement; constructor(private ElementRef: ElementRef) […]