To create a component dynamicly. 1. Add a container with ref: @Component({ selector: 'app-root', template: ` <div> <div #entry> <!-- We want to create auth-form component inside this div--> </div> </div> ` }) 2. View this con…
When you generate Angular 2 components, you’re still able to access the component instance to set properties and invoke methods from the component class. import {Component, ViewChild, ViewContainerRef, ComponentFactoryResolver, Input} from '@angular/…
You can generate Angular 2 components using a combination of ViewContainer and ComponentFactory, but you must always remember to add the components you want to generate to your list of entryComponents otherwise the compiler will optimize the componen…
refer : https://material.angular.io/cdk/table/overview https://material.angular.io/components/table/overview 通常我们做 control panel 时会大量运用到 table 尤其是处理 CRUD 时, table 更是神器 说到 table 就一定会附带以下这些东西 filter, search pagination sort show/hide/sort columns select…
Components that you use across multiple applications need to follow a module pattern that keeps them separate from your application logic. This will allow you to make these Angular 2 components reusable and shareable and is the same pattern followed…
A common scenario is to present different components based on the state of the application. Dynamic components in Vue make this simple by providing a component element that simply needs to be bound to the component that you want to render. This examp…
vue & dynamic components https://vuejs.org/v2/guide/components-dynamic-async.html keep-alive https://cn.vuejs.org/v2/api/#keep-alive <keep-alive> <component v-bind:is="currentTabComponent"></component> </keep-alive> w…
By default, when you generate components, they will simply be added to the page in order, one after another. Angular 2 provides methods on the ViewContainer that allow you to reorder components once they’ve been created and provide the order that you…
After the original order is set, you can still leverage methods on the Angular 2 ViewContainer to reorder the components. This is especially helpful when you want an event to trigger layout changes from your generated components. import { Component,…
After create a component dynamic, we are able to change the component's props and listen to its event. component: ComponentRef<AuthFormComponent>; ngAfterContentInit() { const factory = this.resolver.resolveComponentFactory(AuthFormComponent);this.c…