Move abp-tree css to angular.json an inject with lazyLoadService

npm/ng-packs/packages/components/tree/src/lib/components/tree.component.scss

@@ -1,4 +1,4 @@
-.ant-tree {
+abp-tree .ant-tree {
   color: inherit;
 
   .ant-tree-node-content-wrapper.ant-tree-node-selected {
@@ -7,6 +7,9 @@
 
   .ant-tree-switcher {
     line-height: 17px;
+    align-items: center;
+    justify-content: center;
+    display: inline-flex;
   }
 
   .ant-tree-node-content-wrapper {
@@ -19,13 +22,12 @@
     position: relative;
     display: inline-block;
     margin: 0;
-    padding: 0 5px;
     line-height: 30px;
     text-decoration: none;
     vertical-align: top;
     border-radius: 2px;
     cursor: pointer;
-    padding-left: 8px;
+    padding: 0 5px 0 8px;
     border: 1px solid transparent;
   }
 

npm/ng-packs/packages/components/tree/src/lib/components/tree.component.ts

@@ -12,22 +12,27 @@ import { of } from 'rxjs';
 import { TreeNodeTemplateDirective } from '../templates/tree-node-template.directive';
 import { ExpandedIconTemplateDirective } from '../templates/expanded-icon-template.directive';
 import { NgbDropdown } from '@ng-bootstrap/ng-bootstrap';
+import { LazyLoadService, LOADING_STRATEGY, SubscriptionService } from '@abp/ng.core';
 
 export type DropEvent = NzFormatEmitEvent & { pos: number };
 
 @Component({
   selector: 'abp-tree',
   templateUrl: 'tree.component.html',
-  styleUrls: [
-    '../../../../../../node_modules/ng-zorro-antd/tree/style/index.min.css',
-    'tree.component.scss',
-  ],
+  styleUrls: ['tree.component.scss'],
   encapsulation: ViewEncapsulation.None,
+  providers: [SubscriptionService],
 })
 export class TreeComponent {
   dropPosition: number;
 
   dropdowns = {} as { [key: string]: NgbDropdown };
+  constructor(private lazyLoadService: LazyLoadService, subscriptionService: SubscriptionService) {
+    const loaded$ = this.lazyLoadService.load(
+      LOADING_STRATEGY.AppendAnonymousStyleToHead('ng-zorro-antd-tree.css'),
+    );
+    subscriptionService.addOne(loaded$);
+  }
 
   @ContentChild('menu') menu: TemplateRef<any>;
   @ContentChild(TreeNodeTemplateDirective) customNodeTemplate: TreeNodeTemplateDirective;