directive

问题 I'm just learning angular and have a problem i just can't figure out how to solve it. I'm trying to achieve the following. Tab A / Tab B / Tab C ................................. Content in a fixed height Container When i click a tab, some content is loaded via json and displayed in the container. Since its a lot of content i get a scrollbar. What i want to do now is: Store the scrollTop Position for each Tab, so you can continue reading where you left when you switch tabs. At the moment i

问题 I have two DIVs - one, that is always visible, and another one, that gets displayed after I click a button (it is toggable): <div> <div> <small>ADDRESS</small> <p [appQueryHighlight]="query">{{ address}}</p> </div> </div> <div *ngIf="showDetails"> <div> <small>NAME</small> <p [appQueryHighlight]="query">{{ name}}</p> </div> </div> My custom directive works well on the first DIV (it changes the color of letters inside the paragraph that match the query entered in an "input"), but does not work

问题 I'm trying to create a directive for an input element that will dynamically create an ng-pattern to check for a valid IP address in the input field. All of my attempts to do so have been completely unsuccessful. While I can dynamically modify other attributes, I can't create an ng-pattern that will affect the $valid status. Here's the code that I've been working on which seems like it should work, but it doesn't do anything to the ng-pattern . app.directive('ipAddress', function($parse) {

问题 I am creating my website in angular 5 I have homepage, stores and categories as pages in my site Initially I decided to keep header and footer as global across the website. I mean to create a header and footer components and use them as directives <app-header></app-header> <app-homepage></app-homepage> <app-header></app-header> <app-header></app-header> <app-stores></app-stores> <app-header></app-header> <app-header></app-header> <app-categories></app-categories> <app-header></app-header> I

问题 I'm trying to create a button directive that can receive a boolean via @Input and get bound to the disable attribute of the <button> element. Here's what I've got so far: loading-button.directive.ts @Directive({ selector: '[appLoadingButton]' }) export class LoadingButtonDirective implements OnInit { @Input() loaderState: boolean; constructor(private renderer: Renderer2, private el: ElementRef) { } ngOnInit() { this.renderer.setAttribute(this.el.nativeElement, 'disabled', this.loaderState ?

问题 I have a Component that is called ButtonComponent: import { Component } from "angular2/core"; @Component({ selector: 'btn', template: '<div class="btn"><ng-content></ng-content></div>' }) export class ButtonComponent { } and Directive: import { Directive, Input } from 'angular2/core'; @Directive({ selector: 'btn[dialog-data]' }) export class DialogButtonDirective { @Input('dialog-data') public dialogData: any; } But if I try to use it like this: <btn [dialog-data]="dart()">DART</btn> Then

问题 I write below directive to make call a function when ngRepeat element gets rendered on UI. Directive directives.directive('repeatDone', function() { return { restrict: 'A', require: 'ngRepeat', link: function(scope, element, attrs, ngModel) { if (scope.$last) { scope.$eval(attrs.repeatDone); } } }; }); But it is giving $compile error. If I remove require part, it works OK. Why AngularJS can not accept "require: 'ngRepeat'"? Help would appreciated. 回答1: require is used for accessing the

问题 I am trying to make some reusable countdown widgets. Works well with a static content, but when i'm trying to add them on the fly, my directive doesn't understand the variables inside the ngRepeat. Markups: <div ng-repeat="cdn in countdowns" class="countdown" countdown-end="{{cdn}}"> <p ng-hide="over">{{days}} jours {{hours}} heures {{minutes}} min {{seconds}} sec</p> <p ng-show="over">Done</p> </div> Directive: ... link: function(scope, elm, attrs) { scope.days = '1'; ... } ... http:/

问题 I'm trying to build a custom directive for Bootstrap that makes a <select> input into a "selectpicker" from Bootstrap selectpicker Also I would like this directive to use the default options functionality of VueJS for filling the options on a <select> So the html would be something like this: <select v-selectpicker="myValue" options="myOptions"></select> Now I can create the directive perfectly and use the bind method to call the selectpicker() method on the element. The problem seems to be

问题 I am trying to bring jQuery Sparkline at each row in one cell in ng-grid. The column contains numeric array data. Plunkr --> http://plnkr.co/edit/1eNEcx6FQWcJynlVYvFw?p=preview I am using directive with cell template to achieve this. Cell Template: Directive: app.directive('ngAge', function() { return{ restrict: 'C', replace: true, translude: true, scope: {ngAgeData: '@'}, template: '<div>' + '<div class="sparklines"></div>' + '</div>', link: function(scope,element,attrs){ // var arrvalue=