seperate ng-select into a ng-select lib

src/app/app.module.ts

@@ -12,6 +12,7 @@ import { InMemoryCache } from 'apollo-cache-inmemory';
 import { HttpClientModule } from '@angular/common/http';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 
+
 export function app_Init(apollo: Apollo, httpLink: HttpLink) {
   return async () => {
     const defaultOptions: DefaultOptions = {
@@ -50,6 +51,7 @@ export function app_Init(apollo: Apollo, httpLink: HttpLink) {
   declarations: [
     AppComponent,
     HomeComponent,
+    //SelectLabelTemplateDirective,
     
   ],
   imports: [

src/app/ng-select-demo/ng-select-demo.module.ts

@@ -4,7 +4,8 @@ import { NgSelectDemoComponent } from './ng-select-demo/ng-select-demo.component
 import { NgSelectDemoRoutingModule } from './ng-select-demo-routing.module';
 import { NgSelectModule } from '@ng-select/ng-select';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { PsSelectorsModule } from '@poweredsoft/ngx-cdk-ui';
+import { PsNgSelectorsModule } from '@poweredsoft/ng-select';
+
 
 
 
@@ -16,7 +17,7 @@ import { PsSelectorsModule } from '@poweredsoft/ngx-cdk-ui';
     FormsModule,
     ReactiveFormsModule,
     NgSelectDemoRoutingModule,
-    PsSelectorsModule  //our ng select module
+    PsNgSelectorsModule
   ]
 })
 export class NgSelectDemoModule { }

src/app/ng-select-demo/ng-select-demo/ng-select-demo.component.html

@@ -1,25 +1,27 @@
 <h2>Single Select Demo</h2>
 <ps-ng-select [dataSource]="merchantDataSource" bindLabel="name" bindValue="id" [serverFiltering]="true">
-    <div *psSelectOptionTemplate="let item">
+    <div *psNgSelectLabel="let item">
         {{ item.name }} - {{ item.address }}
     </div>
 </ps-ng-select>
 
 
-<h2>Multi-Select Demo</h2>
-<ps-ng-multi-select [dataSource]="merchantDataSource" [searchPath]="'name'" [sortingPath]="'name'" [disableServer]="false" [bindLabel]="'name'"></ps-ng-multi-select>
+<!-- <h2>Multi-Select Demo</h2>
+<ps-ng-multi-select [dataSource]="merchantDataSource" [searchPath]="'name'" [sortingPath]="'name'" [disableServer]="false" [bindLabel]="'name'"></ps-ng-multi-select> -->
 
 
 <!-- <form>
     <ps-ng-select [dataSource]="merchantDataSource" searchPath="name" sortingPath="name" formControlName="name" [disableServer]="false" bindLabel="name">
-        <ng-template *psSelectOptionTemplate="let item" ng-label-tmp >
+        <ng-template *psNgSelectLabel="let item" ng-label-tmp >
             <span>Name: </span> {{item.name}} | <span>Adress: </span>{{item.address}} | <span>Date: </span>{{item.openDate}}
         </ng-template>
     </ps-ng-select>
 </form> -->
+
+<!-- 
 <form #form [formGroup]="myForm">
     <ps-ng-select [dataSource]="merchantDataSource" bindLabel="name" bindValue="id" formControlName="merchantId">
-        <div *psSelectOptionTemplate="let item">
+        <div *psNgSelectLabel="let item">
             {{ item.name }} - {{ item.address }}
         </div>
     </ps-ng-select>
@@ -29,9 +31,9 @@
 
 
 <ps-ng-select [dataSource]="merchantDataSource" bindLabel="name" bindValue="id" [(ngModel)]="myValue">
-    <div *psSelectOptionTemplate="let item">
+    <div *psNgSelectLabel="let item">
         {{ item.name }} - {{ item.address }}
     </div>
 </ps-ng-select>
 
-{{ myValue | json }}
+{{ myValue | json }} -->