Issue I’m using django-pipeline along with browserify based on the documentation here – http://gregblogs.com/how-django-reactjs-and-browserify/ I have it working perfectly fine when loading NPM/Bower packages like so – ‘build_js’: { ‘source_filenames’: ( ‘js/bower_components/jquery/dist/jquery.js’, ‘bootstrap/js/bootstrap.js’, ‘js/bower_components/react/react-with-addons.js’, ‘js/bower_components/react/react-dom.js’, ‘datatables/js/jquery.dataTables.js’, ‘datatables/js/dataTables.bootstrap.js’, ‘js/node_modules/marked/marked.min.js’, ‘js/node_modules/react-router/umd/ReactRouter.js’, ‘js/child.js’,
Continue readingdjango-pipeline DEBUG=True, compressed file not found
Issue OK. I going mad using django-pipeline and I am one step away from not using it at all. I am not in production yet. All of the below is happening in development (DEBUG=True) mode. My css static files live
Continue readingDjango-pipeline invalid syntax
Issue I am trying to setup django-pipeline in my test project, however, I am running into a bug which doesn’t have an obvious solution. Here is the pipeline configure in the settings.py PIPELINE = { ‘PIPELINE_ENABLED’: True, ‘COMPILERS’: (‘pipeline_browserify.compiler.BrowserifyCompiler’, ),
Continue readingFileNotFoundError with browserify during django collectstatic
Issue I am using django-pipeline-browserify to bridge django-pipeline and browserify. However, I am not able to collectstatic without the following error. And I am able to manually compile the js file by copying the command showed in the error message.
Continue readingWebapp Roboto font anomaly only when live site is viewed from Windows
Issue There’s a webapp where we use Roboto font, it’s loaded directly from Google: @import url(//fonts.googleapis.com/css?family=Roboto:400,100,300,500,700,300italic); The website looks OK when viewing from OSX. The live website doesn’t load Roboto though when it is viewed from browsers on Windows (Chrome,
Continue readingHow to prevent name mangling of javascript functions in django-pipeline
Issue I am using django version 1.82 with django-pipeline. I call a particular javascript function from html by name. <form class=”navbar-form navbar-right vcenter” action=”javascript:search();” role=”search” id=’searchform’> Unfortunately in the compressed js file, the name of the function is changed and
Continue readingdjango-pipeline wipes out my entries in Django Database Cache
Issue I’m working on a Django application which uses django-pipeline for dealing with browsers’ file caching issues (and also for other benefits). STATIC_URL = ‘/static/’ STATICFILES_STORAGE = ‘pipeline.storage.PipelineCachedStorage’ STATICFILES_DIRS = ( os.path.join(PROJECT_ROOT, ‘bower’), ) STATICFILES_FINDERS = ( ‘django.contrib.staticfiles.finders.FileSystemFinder’, ‘django.contrib.staticfiles.finders.AppDirectoriesFinder’, ‘pipeline.finders.PipelineFinder’,
Continue readingdjango-pipeline crashes python social auth
Issue Currently I’m working in a little project that is contemplating social authentication (so python-social-auth is great). Also, I wanna to integrate django-pipeline to handle my assets (css principally). JS to perform a social sign up: vm.doSocialAuth = function(provider) {
Continue readingdjango-pipeline: Why do these JS lines cause yui-compressor to crash?
Issue I have a Django app, and within the app I’m trying to bundle and minify all Javascript files and CSS files. To do this, I’m using django-pipeline 1.2.6, and I have configured my settings file such that it uses
Continue readingDjango-pipeline is not been able to access a file. Access Denied Error
Issue I am using Django-pipeline for asset minification and compression but there seems to be an error when I try to run ./manage collectstatic I get the following error.. django.core.exceptions.SuspiciousFileOperation: Attempted access to ‘/home/darwesh/projects/first/api/static/js/app/check.js’ denied. Here is my settings.py file
Continue readingDjango pipeliner: /usr/bin/env: yuicompressor: No such file or directory
Issue I have the following versions of django and django-pipeline: Django==1.10.3 django-pipeline==1.6.9 In /usr/bin/ I see “yui-compresssor” listed. Running collectstatic gives the following error. pipeline.exceptions.CompressorError: /usr/bin/env: yuicompressor: No such file or directory When I run my site with debug set
Continue readingValueError: Empty key names are not allowed when using collectstatic django
Issue I am using django-pipeline S3PipelineManifestStorage with django-storages When I use collectstatic to upload and post-process(minify) my assets, I get an error when post-processing. Earlier, collectstatic worked fine and gave no error. Here’s the full traceback Traceback (most recent call
Continue readingValueError: Empty key names are not allowed when using collectstatic django
Issue I am using django-pipeline S3PipelineManifestStorage with django-storages When I use collectstatic to upload and post-process(minify) my assets, I get an error when post-processing. Earlier, collectstatic worked fine and gave no error. Here’s the full traceback Traceback (most recent call
Continue readingRuntimeError when building CSS from SCSS files of Foundation-sites with Django-pipeline
Issue My issue is in the same context as Django-Bower + Foundation 5 + SASS. I’m trying to compile foundation from scss to css. The problem is that I’m encountering the following RuntimeError: /home/hakim/.gem/ruby/2.4.0/gems/sass-3.4.23/lib/sass/exec/sass_scss.rb:287:in `watch_or_update’: File /home/hakim/github/myquotes/static/quotes/app.css doesn’t exist. (RuntimeError)
Continue readingWhy django-pipeline does not collect static?
Issue I’ve followed django-pipeline docs and I am having an issue when collecting static, the console shows that the specified file is not found. collectstatic works without djanog-pipeline. I also tried to add static file at the same level as
Continue readingdjango-pipeline FileNotFoundError when i perform manage.py collectstatic
Issue It’s last some lines of traceback : File “C:\PycharmDev\TestVirtualEnv\testEnv1\lib\site-packages\pipeline\compressors\__init__.py”, line 247, in execute_command stdin=subprocess.PIPE, stderr=subprocess.PIPE) File “C:\Python34\Lib\subprocess.py”, line 859, in __init__ restore_signals, start_new_session) File “C:\Python34\Lib\subprocess.py”, line 1112, in _execute_child startupinfo) FileNotFoundError: [WinError 2] … And in settings.py : BASE_DIR
Continue readingUsing Django pipeline browserify on Windows
Issue I’m trying to follow http://gregblogs.com/how-django-reactjs-and-browserify/. I went through some hoops to get collectstatic working but it runs without error now. However when I try to load the page which contains my react component, another compilation process kicks in (I
Continue readingdjango-pipeline and s3boto storage don't seem to work together
Issue I’m trying to use django-pipeline-1.1.27 with s3boto to compress and filter static files, and then upload them to an s3 bucket. If I just use: PIPELINE_STORAGE = ‘pipeline.storage.PipelineFinderStorage’ Then it works and I get a static folder with the
Continue readingAutomatically remove source files after collectstatic with django-pipeline
Issue With django-pipeline, is it possible to automatically remove source files after collectstatic ? for example : PIPELINE_JS = { ‘stats’: { ‘source_filenames’: ( ‘js/jquery.js’, ‘js/d3.js’, ‘js/application.js’, ), ‘output_filename’: ‘js/stats.js’, } } collectstatic : $ python manage.py collectstatic $ ls
Continue readingHow to specify a device-specific css file when I compress all the css files using pipeline in Django?
Issue In order to use CSS3 Media Queries to create a mobile version of my website, I’m gonna create a seperate css file used for small screen devices. If I don’t use pipeline compressor in django, I would just add
Continue readingDjango pipeline can't find static css files
Issue I’ve configured django-pipeline to compress js and css. While js works, it is not able to find css files. The files can be found using findstatic command. I’m testing it with just one file now which has a single
Continue readingDjango-pipeline not serving files in development mode
Issue I’m trying to compile static with django-pipeline, but can’t manage to serve static in dev mode. Since I’m not a Django developer, I may be wrong how Django serves static files itself. Here’s my project structure: project (project itself)
Continue readingDjango-ckeditor and django-pipeline
Issue I have an issue with django-ckeditor, I’m using it with django-pipeline, everything it’s ok when is run locally, but if DEBUG=False the ckeditor.js used is the compressed one and fails. This is the issue I get from the developer
Continue readingDjango Pipeline, Heroku, and SASS
Issue I’ve been trying to get django-pipeline setup so that I can compile and concat my assets. I would also like to remove the compiled css files from my repository to avoid merge conflicts in pull requests. I’ve been trying
Continue readingYuglify compressor can't find binary from package installed through npm
Issue I have a fresh virtualenv environment and have got the latest django-pipleline. The JS compression with Closure works perfect, but CSS compression with Yuglify fails, due a node error: STATICFILES_STORAGE = ‘pipeline.storage.PipelineCachedStorage’ PIPELINE_JS_COMPRESSOR = ‘pipeline.compressors.closure.ClosureCompressor’ PIPELINE_CSS_COMPRESSOR = ‘pipeline.compressors.yuglify.YuglifyCompressor’ When
Continue readingDjango-storages + django-pipeline + gzip
Issue I would like to gzip my static assets to s3 with the Gzip and s3 mixins from django storages, and serve the gzipped files with the static/compressed template tag. Is this possible? I don’t see information in the docs
Continue readingdjango-pipeline throwing ValueError: the file could not be found
Issue When running python manage.py collectstatic –noinput I’m getting the following error: Post-processing ‘jquery-ui-dist/jquery-ui.css’ failed! Traceback (most recent call last): File “manage_local.py”, line 10, in <module> execute_from_command_line(sys.argv) File “/Users/michaelbates/GoogleDrive/Development/inl/venv/lib/python3.4/site-packages/django/core/management/__init__.py”, line 367, in execute_from_command_line utility.execute() File “/Users/michaelbates/GoogleDrive/Development/inl/venv/lib/python3.4/site-packages/django/core/management/__init__.py”, line 359, in execute
Continue readingHow to install Node Packages for an Elastic Beanstalk Python 3.7 Project Running on 64bit Amazon Linux 2?
Issue I am using a Django package named django-pipeline to compress js and css files. When I deploy my project, I run Django’s collectstatic command, from .ebextensions folder: 01_django.config: container_commands: … 07_collectstatic: command: "source /var/app/venv/*/bin/activate && python3 manage.py collectstatic –noinput"
Continue readingdjango pipeline FileNotFoundError when the path is right
Issue I’m trying to add pipeline to my django project. But it’s throwing me winerror 2 (FileNotFoundError) when I’m trying to execute collectstatic settings.py STATIC_URL = ‘static/’ STATICFILES_STORAGE = ‘pipeline.storage.PipelineStorage’ STATIC_ROOT = ‘static’ STATICFILES_FINDERS = ( ‘django.contrib.staticfiles.finders.FileSystemFinder’, ‘django.contrib.staticfiles.finders.AppDirectoriesFinder’, ‘pipeline.finders.PipelineFinder’, )
Continue readingHow to keep dynamic popup displaying on hover
Issue I have created a dynamic popup in angular that appears when I hover over span(or button) but disappear when I leave that span. I cannot figure out how to keep that popup displaying when I’m hovering over it. Gotta
Continue readingAngular: How to use shared modules in a Dynamic Component?
Issue I’m creating dynamic component in Angular v6 using compileModuleAndAllComponentsAsync of angular compiler with same below code. viewChangeMethod(view: string) { let template = `<span>${view} </span>`; const tmpCmp = Component({ template: template })(class { }); this._compiler.clearCacheFor(this.tmpModule) this.tmpModule = NgModule({ declarations: [tmpCmp,FRAComponent],import:[ComonModule]
Continue readingAngular: How to use shared modules in a Dynamic Component?
Issue I’m creating dynamic component in Angular v6 using compileModuleAndAllComponentsAsync of angular compiler with same below code. viewChangeMethod(view: string) { let template = `<span>${view} </span>`; const tmpCmp = Component({ template: template })(class { }); this._compiler.clearCacheFor(this.tmpModule) this.tmpModule = NgModule({ declarations: [tmpCmp,FRAComponent],import:[ComonModule]
Continue readingAngular: How to import JitCompilerFactory?
Issue If I use AOT compilation dynamic compilation will not possible. So I need to load the compiler to a browser. So how do I load it? If I use import { JitCompilerFactory } from ‘@angular/compiler’; However, after importing the
Continue readingDynamic Angular component
Issue I have a requirement to add a dynamic component to the Angular application. The idea is to bundle the component in one JavaScript file which will be downloaded on some condition. The whole idea is to ship independent components(features)
Continue readingAccess an instance of a component and change its value in angular 6
Issue <rio-hello name=”World”></rio-hello> <rio-hello [name]=”helloName”></rio-hello> onClick of the first component I want to change the value of the second component The value (the name) should be changed from “helloworld” to “myworld”. Both components are loaded on the same page. How
Continue readingWhy Angular requires us to declare dynamic components in declarations array and entryComponents array?
Issue I was implementing dynamic components for one of my project. The concept of dynamic components is that they come into the memory once they are needed and they have no reference in any template. According to the official docs
Continue readingHow to pass i18n key from parent to child component before translation starts?
Issue I’am using an input-field component which I can embed in different parent components using forms. In the input child component, I have an i18n translation key as variable using interpolation, which I would like to generate dynamically from parent
Continue readingHow to pass i18n key from parent to child component before translation starts?
Issue I’am using an input-field component which I can embed in different parent components using forms. In the input child component, I have an i18n translation key as variable using interpolation, which I would like to generate dynamically from parent
Continue readingTooltip as dynamic component
Issue I want to add tooltip to the svg element, but as a component created dynamically. I add the tooltip to the element, using TooltipDirective on svg element i.e. <circle tooltip [hostContainerRef]=”chartContainerRef” [hostElement]=””>chartElement [data]=”d.tooltip”></circle> The TooltipDirective dyncamically creates TooltipComponent (in
Continue readingUsing a generic Component with resolveComponentFactory result in Component<{}> instead of <T>
Issue I have build a dialog service which dynamically create a DialogComponent with a child component. I want my DialogComponent to be a generic class of <T> since i wish to type for whatever component child i’m using. I’m currently
Continue readingDynamically load nested components in angular?
Issue I want to organise my all tabs components dynamic components. I am using primg ng for ui tabs. Currently my code is allTabs.component.html Before <p-tabPanel header=”Contracts”> <app-a [arrId]=’parrangementId’ *ngIf=”tabIndex==1″></app-a> </p-tabPanel> <p-tabPanel header=”Allocations”> <app-b [arrId]=’parrangementId’ *ngIf=”tabIndex==2″></app-b> </p-tabPanel> </p-tabView> Here each
Continue readingInputs was not working by dynamic component
Issue I implemented with ndc-dynamic for creating dynamic component. It works very well with outputs, but inputs was not working. I will show my code. <ng-container *ngComponentOutlet=”item.widgetComponent; ndcDynamicInputs: inputs; ndcDynamicOutputs: outputs”> in the ts file aButtonDisabled: boolean; bButtonDisabled: boolean; inputs
Continue readingHow to dynamically add angular components to the DOM without a pre-determined ViewContainerRef?
Issue This is a solution I found that I think will be useful to others. This can be applied to any native element that does not have a ViewContainerRef set on it. I am trying to implant an angular component
Continue readingHow to dynamically add angular components to the DOM without a pre-determined ViewContainerRef?
Issue This is a solution I found that I think will be useful to others. This can be applied to any native element that does not have a ViewContainerRef set on it. I am trying to implant an angular component
Continue readingHow to dynamically add angular components to the DOM without a pre-determined ViewContainerRef?
Issue This is a solution I found that I think will be useful to others. This can be applied to any native element that does not have a ViewContainerRef set on it. I am trying to implant an angular component
Continue readingAngular – using how to call function on component created dynamically using ng-dynamic-component
Issue I am using the npm package ng-dynamic-component to create dynamic components. I am in a situation where i want to call a specific function on the dynamically created component using this package. I have experimented with a lot of
Continue readingAngular – using how to call function on component created dynamically using ng-dynamic-component
Issue I am using the npm package ng-dynamic-component to create dynamic components. I am in a situation where i want to call a specific function on the dynamically created component using this package. I have experimented with a lot of
Continue readingDynamically load component into dynamic position
Issue UPDATED (As I understood the issue better): I would like to show a component depending on where the user clicks (which table row), I’m using ng2-smart-table, now the problem is there is no selector to where I need to
Continue readingprevent angular from recursively loading component
Issue I’m loading component dynamically into dynamic position and since that component is a table row I’m using selector: ‘td’ because I need to apply colspan to the dynamically add row then load the dynamic component in it. The problem
Continue readingAngular 6 communicate between 2 components instances through service
Issue I have a component that loads/remove another component dynamically by calling a service. I also give the dynamically add component the ability to remove itself. My problem is notifying the other component that this instance of the dynamic component
Continue readingCreating dynamic nested components from json response
Issue I’m trying to created nested dynamic components based on json response. public content={type:’paragraph’,depth:1,text:’Root’,entityRanges:[{type:’LINK’,offset:83,length:16,data:{target:’_self’,url:’/index.htm’}}],embbeded:[{type:’text’,text:’This is Text component’}]} So in the above structure, it as type paragraph so the ParagraphComponent need to render first. It as an array object embbeded, in
Continue readingHow to use reactive forms in a dynamic component
Issue Background I receive client generated data from the server that contains HTML that I then use to create a dynamic component that gets injected and displayed in our client. The HTML I receive can contain one or many inputs
Continue readingWhen is OnInit event triggered for a dynamically loaded angular component?
Issue I am dynamically loading an Angular component (MyComponent) with the following code. I am also passing some data to the component after creating it. let componentFactory = this.componentFactoryResolver.resolveComponentFactory(MyComponent); this.viewContainerRef.clear(); let componentRef = this.viewContainerRef.createComponent(componentFactory); (<MyComponent>componentRef.instance).setData(data); When will the OnInit lifecycle
Continue readingpass Dynamic Html element based on options from parent to child component in Angular?
Issue I want to pass html element from parent to child based on conditions like If user click button in parent child should display button or If user select chckbox then child should display checkbox This is my scenario To
Continue readingDynamic component not loading inside patent component
Issue I’m creating dynamic component based on it’s type. With the above structure, I created parent component which is ParagraphComponent and If you notice ranges is having a type so I wanted to create a LinkComponent. What’s the Problem ?
Continue readingDynamic component not loading inside patent component
Issue I’m creating dynamic component based on it’s type. With the above structure, I created parent component which is ParagraphComponent and If you notice ranges is having a type so I wanted to create a LinkComponent. What’s the Problem ?
Continue readingBest Way To Add Angular Component At RunTime On Click Event
Issue The website I am building has multiple components. On the “Home” page component, when a user clicks a button to add something to the page, I want to append the component of their choice to the “home” component. I
Continue readingHow to remove a component dynamically in angular
Issue I went through angular dynamically loading components. But i could not find how to remove the component dynamically. My requirement is that the chat application loads dynamic component(image/graph/list/table) as per the conversation. But how can i destroy the component
Continue readingHow to dynamically add component to another component in service
Issue I would dynamically component to another component in the service , Firstly inside the service factory both components and I created the component with access to ViewContainer. But the component cannot be create ! Service : @Injectable({ providedIn: ‘root’
Continue readingHow to dynamically add component to another component in service
Issue I would dynamically component to another component in the service , Firstly inside the service factory both components and I created the component with access to ViewContainer. But the component cannot be create ! Service : @Injectable({ providedIn: ‘root’
Continue readingHow to dynamically add component to another component in service
Issue I would dynamically component to another component in the service , Firstly inside the service factory both components and I created the component with access to ViewContainer. But the component cannot be create ! Service : @Injectable({ providedIn: ‘root’
Continue readingLoad dynamic component multiple times with different data
Issue I need to load a dynamic component multiple times and pass data dynamically based on some value so that it will load with runTime data. I have tried below example https://dzone.com/articles/how-to-dynamically-create-a-component-in-angular as per example we have one messageComponent that
Continue readingOutputs on dynamic components without view
Issue On an Angular 8 project i created some dynmic components without a viewref with the following code: const componentFactory = this.componentFactoryResolver.resolveComponentFactory(HelloComponent); const componentRef = componentFactory.create(this.injector); componentRef.changeDetectorRef.detectChanges(); componentRef.instance.slideContentRendered.pipe(first()).subscribe(x => {console.log(‘does not work’, x);}); in the HelloComponent itself i’m waiting for
Continue readingAngular Dynamic Components: How to Set and Get Data
Issue I need to create components dynamically based on a predetermined type, and be able to set and get data from them. Up until now I’m able to create and show the componentes, but I don’t know how to set
Continue readingMatDialogRef textarea scrolls to bottom
Issue I have an app where i use MatDialogRef to open a component as a dialog. The dialog shows a long text, but for some reason, the textarea scrolls to the bottom. This does not happen when it’s not a
Continue readingViewContainerRef vs ngFor
Issue What is better? Use ngFor or ViewContainerRef to dynamically create components? What is the difference? For example, if I have a button to create a new element that every time I press it generates a new component. 1) The
Continue readingAngular component in NgbModal cannot use @viewchild to access methods inside
Issue Im having the following problem, i think its a common case but i havent been able to solve it. I have a small error alert component, which has a method inside to show an error. The way im using
Continue readingCreate dynamic component (ComponentFactoryResolver) with dynamic template
Issue I want to dynamically create a component with a dynamic template, so that interpolations of this template will resolve in the context of the dynamic component. I know that I can use this code to create a dynamic component
Continue readingCreate dynamic component (ComponentFactoryResolver) with dynamic template
Issue I want to dynamically create a component with a dynamic template, so that interpolations of this template will resolve in the context of the dynamic component. I know that I can use this code to create a dynamic component
Continue readingCreate dynamic component (ComponentFactoryResolver) with dynamic template
Issue I want to dynamically create a component with a dynamic template, so that interpolations of this template will resolve in the context of the dynamic component. I know that I can use this code to create a dynamic component
Continue readingDynamic component loader – Cannot read property 'viewContainerRef' of undefined
Issue im following all steps of the ad-banner tutorial on Angular.io. But at the end after all setup, i get an error comming from this component and function: Ad-banner.component TS loadComponent() { this.currentAdIndex = (this.currentAdIndex + 1) % this.ads.length; const
Continue readingDynamic component loader – Cannot read property 'viewContainerRef' of undefined
Issue im following all steps of the ad-banner tutorial on Angular.io. But at the end after all setup, i get an error comming from this component and function: Ad-banner.component TS loadComponent() { this.currentAdIndex = (this.currentAdIndex + 1) % this.ads.length; const
Continue readingAngular: capture an event emmited inside a dynamic container
Issue I don’t know if the title of the question is up to the challenge, but I’m trying to capture an event(click) issued by a dynamic component. My goal is to create a component onClick and destroy it by the
Continue readingPass @Input as Parameters fires Type 'string' has no properties in common with type
Issue I am creating a dynamic tab based components and passing the necessary component properties to build the component through an object. How to pass @Input as a parameter and then use the input with ComponentFactoryResolver and create inputs. Here
Continue readinghaving an empty page while calling a dynamic component angular 9
Issue I try to call a dynamic component from another component but it showing me an empty page This is the dynamic component.ts : @Component({ selector: ‘app-draw-linechart’, templateUrl: ‘./draw-linechart.component.html’, styleUrls: [‘./draw-linechart.component.css’] }) export class DrawLinechartComponent implements OnInit { constructor(private productservice:
Continue readingAngular – change detection in dynamically loaded module/component without using `ChangeDetectorRef`
Issue I compile an Angular module (to load the module dynamically) with compiler’s compileModuleAsync and want to insert a component of the module into view. I tried to insert the component into ViewContainer but the component doesn’t detect changes automatically.
Continue readingDynamic Component Loading – get component as variable
Issue I’m implementing a relatively complex component loader in Angular, and I’d like to dynamically get the component instance from a rxjs store. loadEditAreaComponent(component: any, componentInstanceData?: {}){ const componentFactory = this.cfr.resolveComponentFactory(component); const viewContainerRef = this.editAreaHost.viewContainerRef; const componentRef = viewContainerRef.createComponent(componentFactory); Object.keys(componentInstanceData).forEach(key
Continue readingWay to inject angular FormBuilder service to dynamic component
Issue I’m trying to inject the FormBuilder service to a dynamic component this way: Template: … <div #vc></div> … Component: @ViewChild(‘vc’, { read: ViewContainerRef }) _container: ViewContainerRef; … constructor(private fb: FormBuilder, private componentFactoryResolver: ComponentFactoryResolver, private _compiler: Compiler, private _injector: Injector,
Continue readingCreating nested dynamic components in angular
Issue I Want to know how to create nested dynamic components and maintains its parent child relationship. For example, I have data like this, – A –A.1 –A.2 -B –B.1 -C I wanted to create the component like this, <A>
Continue readingAngular Dynamically resolved components using nested Reactive Forms with CVA's are not working
Issue Arrgh, Having problems with Dynamically built components using ReactiveForms. Need to trigger and Mat-Dialog and load set of components in it – works fine. Need to build some of the components dynamically from a mapping array – works fine.
Continue readingHow can I scroll into view for dynamic loaded content in Angular 11?
Issue In my app I need to load HTML from a file. This file contains plain HTML code and come anchors. Now, when I click on such an anchor I would like to scroll this anchor into view. Therefore I
Continue readingHow can I scroll into view for dynamic loaded content in Angular 11?
Issue In my app I need to load HTML from a file. This file contains plain HTML code and come anchors. Now, when I click on such an anchor I would like to scroll this anchor into view. Therefore I
Continue readingPrimeNg TabView dynamic component
Issue I am following this approach to dynamically create elements in an AngularApp based on a configuration JSON. Unfortunately that does not seem to work with all of the PrimeNG components. Especially not the TabView which I wanted to utilize
Continue readingWhy is change detection not triggering on nested dynamic component
Issue I have an issue with change detection on nested dynamic component using content projection. Change detection is not triggering automatically on the child component, I have to add manual change detection to every actions. An exemple here : https://stackblitz.com/edit/angular-ivy-k2z661?file=src%2Fapp%2Fapp.component.ts
Continue readingDynamically loaded content in Angular Material Tabs
Issue I’m trying to build a dynamic tab-system from Angular Material: Tabs and I’m running into an issue with the loading of content on subsequent tabs, where the concept only works on the first tab being loaded. Below is the
Continue readingDynamically loaded content in Angular Material Tabs
Issue I’m trying to build a dynamic tab-system from Angular Material: Tabs and I’m running into an issue with the loading of content on subsequent tabs, where the concept only works on the first tab being loaded. Below is the
Continue readingDynamically loaded content in Angular Material Tabs
Issue I’m trying to build a dynamic tab-system from Angular Material: Tabs and I’m running into an issue with the loading of content on subsequent tabs, where the concept only works on the first tab being loaded. Below is the
Continue readingAngular Dynamic Components: @ViewChildren get ViewContainerRef for every component in QueryList
Issue I am building a dialog with dynamic tabs that can receive a component to be placed in the tab body. I am having a hard time creating multiple dynamic components using @ViewChildren. I have successfully done this with a
Continue readingHow to deal with nested ng-template in Angular
Issue I am making a ngx-datatabel wraper and i want to pass the column template from the parent component. Which i am doing through ng-template outlet. But its not being rendered for some reason. Here is how i am passing
Continue readingAngular – How to pass / compose components into a generic component?
Issue anyone know if it is possible to pass a component into another component? I am trying to promote code re-use in our company Dev team, but hitting some blockers . I have a Component for displaying Tabs, I want
Continue readingBest way to dynamically add elements in Angular side by side
Issue I am creating an app which has an API that returns different number of objects in an array depending on the variable that I send him. Depending on how many objects are returned I want to draw that many
Continue readingHow to bind form group to nested dynamically created components in Angular
Issue In my Angular 12 app I have this type of hierarchy: – app.component — Parent component with form (reactive) — Component that creates the dynamic components —- Dynamic component and my formBuilder form looks like this: form = this.fb.group({
Continue readinghow to fetch data from dynamically rendered component in angular
Issue I have rendered some child components (which has some forms and field) in a parent component, now I am unable to fetch data from those child component’s form’s fields Solution There are many ways to share data between components.
Continue readingRecursive Dynamic Angular Form; EmitEvent from Deeper Child to Root (Parent Component)
Issue Hi I’m newbie and I’m creating a project with a Reactive Form; based on Recursive Component that creates Dynamic Form from JSON file. The Sources This is an adaptation from Ionic based on Creating Dynamic Angular Forms with JSON
Continue readingHow to create multiple instances of a dynamic component sequentially?
Issue I have a SystemMessageService which creates instances of SystemMessageComponent using the following method createSystemMessage(message: string, vcr: ViewContainerRef, time: number = 4500, isErrorMessage: boolean = false, isWarningMessage: boolean = false, isSuccessMessage: boolean = false){ let systemMessageCmpFactory = this.componentFactoryResolver.resolveComponentFactory(SystemMessageComponent); this.hostViewContainerRef =
Continue readingHow to create multiple instances of a dynamic component sequentially?
Issue I have a SystemMessageService which creates instances of SystemMessageComponent using the following method createSystemMessage(message: string, vcr: ViewContainerRef, time: number = 4500, isErrorMessage: boolean = false, isWarningMessage: boolean = false, isSuccessMessage: boolean = false){ let systemMessageCmpFactory = this.componentFactoryResolver.resolveComponentFactory(SystemMessageComponent); this.hostViewContainerRef =
Continue readingHow to create multiple instances of a dynamic component sequentially?
Issue I have a SystemMessageService which creates instances of SystemMessageComponent using the following method createSystemMessage(message: string, vcr: ViewContainerRef, time: number = 4500, isErrorMessage: boolean = false, isWarningMessage: boolean = false, isSuccessMessage: boolean = false){ let systemMessageCmpFactory = this.componentFactoryResolver.resolveComponentFactory(SystemMessageComponent); this.hostViewContainerRef =
Continue readingAngular Dynamic Component Creation not rendering dynamic child components
Issue We’ve built a rather fancy dynamic component creation framework to build out complex forms based on json data. We have components that get created via const questionComponent = FieldComponentMap[childField.shortName]; viewContainerRef.createComponent<QuestionComponent>(questionComponent); Those components may create child components of their own,
Continue readingHow to wait for NgOnInit to complete inside Angular Dynamic Component?
Issue I am trying to set reactive form controls inside dynamic component from parent component. @ViewChild("priceSpecComp", { read: ViewContainerRef}) priceSpecComp: ViewContainerRef LoadDynamicComponent(variant, addons) { priceSpecComp.clear(); var comp = priceSpecComp.createComponent(PricingSpecDynamicComponent) comp.instance.setFormControls(variant, addons); } Inside PricingSpecDynamicComponent NgOnInit there is a http call
Continue readingHow to check if component has specific @Inputs when using createComponent
Issue In my angular app I create components dynamically using the new createComponent function. I think this feature was added in v14.1. Anyway, this is my experiment import { createComponent, …. } from ‘@angular/core’; @Directive({ selector: ‘[myInjector]’ }) export class
Continue reading