1

我正在寻找一个拆分窗格库 - 可以让我在屏幕上拥有 2 个表格，并且用户可以拖动中间分隔线以显示更多的一个或另一个表格。

我知道有一些库可以做到这一点，比如 shagstrom 库，但我一直在寻找不依赖 jQuery 的东西。是否存在，如果存在，请您指点一下吗？

4

2 回答 2

2

您可以使用没有依赖项且运行良好的Split.js 。

简单的例子：

Split(['#one', '#two'], {
    sizes: [25, 75],
    minSize: 200
});

这不是角度库，但可以轻松地将其集成到指令中。

于 2016-03-01T20:48:23.803 回答
2

有一个 split.js 角度包装器，angular-split 可以正常运行，这是一个示例，在运行 npm install angular-split --save

将 AngularSplitModule 添加到您的应用模块：

import { AngularSplitModule } from 'angular-split';

@NgModule({
declarations: [
AppComponent,
...
],
imports: [
AngularSplitModule,
...
],
providers: [...],
bootstrap: [AppComponent]
})
export class AppModule {}

import {Component, NgModule} from '@angular/core'
import {BrowserModule} from '@angular/platform-browser'
import { AngularSplitModule } from 'angular-split'

@Component({
selector: 'my-app',
styles: [`
:host {
  display: block;
  width: 500px;
  height: 400px;
  background: grey;
 }
 `],
  template: `
  <split direction="horizontal">
      <split-area [size]="30">
          <p>Lorem ipsum dolor sit amet...</p>
      </split-area>
      <split-area [size]="70">
          <p>Sed ut perspiciatis unde omnis iste natus erro...</p>
      </split-area>
  </split>`,
})
export class App {}


@NgModule({
imports: [ BrowserModule, AngularSplitModule ],
declarations: [ App ],
bootstrap: [ App ]
})
export class AppModule {}

笨蛋

于 2017-10-12T15:48:49.643 回答