angular-directive

Extending FormControlDirective in Angular 2+

由 限于喜欢 提交于 2019-12-11 04:58:00
问题 I'm looking at this question, trying to figure out how to extend FormControlDirective: Attempting to extend FormControlDirective to implement my own FormControl directive results in faulty binding. There is an answer, but I'm not sure what is meant by: The formControl \ formControlName selectors appear in one more place - the value accessor. In order your directive to work you should implement all default value accessors for the hybridFormControl directive ( following the pattern for the

Bind a function with the injected html in angular 7

由 假装没事ソ 提交于 2019-12-11 04:41:04
问题 I wanted to bind a function into the injected html at run time using innerHTML. My component @Component({ selector: 'my-app', template: `<div [innerHtml]="myHTML | safeHtml"></div>`, styleUrls: ['/my-app.css'], encapsulation: ViewEncapsulation.ShadowDom }) export class MyApp implements OnInit { myHTML = `<button (click)="clickMe()" type="button" class="btn btn-secondary">+</button>` constructor() {} clickMe() { console.log("Function is binded using the inner html tag") } } I tried but it does

Angular 6 Directive is not being instantiated in app but is in proof of concept

由 此生再无相见时 提交于 2019-12-11 02:06:14
问题 This proof of concept directive works fine in Firefox stack-blitz and when it is exported into vs code; however when I try to bring it into my application it isn't giving me any error but as you can see it's not logging any of the life-cycle hooks. This is what it looks like in the browser: I have added the code from each component you see in my vs code, below. SO what am I missing here? This works fine in my stack-blitz prototype... Context: My directive is placed on the parent and interacts

Display informations about a bubble chart D3.js in AngularJS

由 不想你离开。 提交于 2019-12-11 00:25:45
问题 I am searching how to display information about a bubble D3.js in AngularJS. I can show an alert with the desired information but I can't display informations on the page with AngularJS because I have no access to the $scope because my graphe is in a directive... How can I pass the informations without change the structure of the web app ? I can't put the formation the bubble chart outsite of this directive. This is my HTML : <body ng-app="d3DemoApp"> <div id="graph1" ng-controller=

Service class is not injected in Angular2

由 橙三吉。 提交于 2019-12-10 23:27:04
问题 I already had everything working yesterday. And today, after I restarted the environment, one of the services that I am trying to inject, is now always null . Here is my top level component (app.component.ts): @Component({ selector: 'priz-app', moduleId: module.id, templateUrl: './app.component.html', directives: [ROUTER_DIRECTIVES, SecureRouterOutlet], providers: [ROUTER_PROVIDERS, AuthenticationService] }) The template of that component contains: <secure-outlet signin="Login" unauthorized=

Binding functions through nested directives with isolated scope failing in Angular 1.4

由 ぃ、小莉子 提交于 2019-12-10 16:46:50
问题 The 1.4 update seems to have introduced an issue when binding functions in nested directives. I have an example plunker: http://plnkr.co/edit/fQLY0N8BTNs38VC8ikll Code: var app = angular.module('myApp', []); app.controller('myCtrl', function(){ this.searchFunction = function(term) { console.log('you searched for ' + term); } }); app.directive('outerDirective', function(){ return { restrict: 'E', scope: { outer: '&' }, template: '<inner-directive inner="cx.outer(term)"></inner-directive>',

Angular Using Directive with @HostListener to Update Input Value of ReactiveForm is Setting Input to ngValid Instead of ngInvalid

由 核能气质少年 提交于 2019-12-10 16:24:07
问题 I've put together a currency attribute directive on a ReactiveForm FormControl that uses @HostListener on an input event (onKeyDown) to remove all invalid characters (letters and symbols) as they are typed into the input, but allows numbers and decimals. BUT , if you type an invalid character (ie. a ) into an empty input field and it gets removed by the directive, the model is not updated. I've added a plunker setup using the currency directive. Steps to follow to understand my question: type

can't use directive declared inside app module in child modules in Angular 6

由 只愿长相守 提交于 2019-12-10 15:08:54
问题 I'm using Angular 6 . I have declared a directive StickyPopover by extending NbgPopover and have added in declaration of app.module.ts import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { AppComponent } from './app.component'; import { AppRoutingModule } from './app-routing.module'; import { AuthLayoutComponent } from './layouts/auth-layout/auth-layout.component'; import {AdminLayoutComponent} from './layouts/admin-layout/admin-layout

Why is “this” null, in the link function within an Angular Directive?

由 给你一囗甜甜゛ 提交于 2019-12-10 13:58:22
问题 I'm trying to write a dynamic template using TypeScript and Angular, however for some reason the 'this' keyword is always null, thus I cannot access my private member $compile. Any ideas? Many Thanks! :-) Directive: namespace ROD.Features.Player { "use strict"; export class VideoDirective implements ng.IDirective { public restrict: string = "E"; public replace: boolean = true; public scope = { content: "=" }; constructor(private $compile: ng.ICompileService) { } public link(element: JQuery,

AngularJS Remove old $watchers when re-compiling dynamic html

由 懵懂的女人 提交于 2019-12-10 09:27:59
问题 I have an AngularJS application that used to Build Pages dynamically (retrieve an XML from Server and by reading that XML building pages or forms) for an XML we have to build few pages all are related with each other and can be negative via 'Next' , 'Previous' buttons. to implement that we have something like, <div> <form name="myController.mainForm" novalidate> <div my-dynamic="myController.dynamicHtml"></div> </form> </div> herer myDynamic is directive, which deals with generated html and
订阅 angular-directive