@angular/forms ReactiveFormsModule TypeScript Examples

Source File: util.module.ts From App with MIT License

7 votes

@NgModule({
	imports: [
		CommonModule,
		MaterialModule,
		RouterModule,
		ReactiveFormsModule
	],
	exports: [
		UserNameComponent,
		ContextMenuComponent,
		TwitchButtonComponent,
		WardrobeComponent
	],
	declarations: [
		UserNameComponent,
		ContextMenuComponent,
		ErrorDialogComponent,
		BanDialogComponent,
		TwitchButtonComponent,
		WardrobeComponent
	],
	providers: [],
})
export class UtilModule { }

Source File: home.component.spec.ts From one-platform with MIT License

6 votes

describe('HomeComponent', () => {
  let component: HomeComponent;
  let fixture: ComponentFixture<HomeComponent>;
  const appService = {
    autorun: jest.fn(() => of({})),
    fetchProjects: jest.fn(() => Promise.resolve({ listLHProjects: [] })),
  };

  beforeEach(async () => {
    await TestBed.configureTestingModule({
      declarations: [HomeComponent],
      imports: [
        RouterTestingModule,
        FormsModule,
        SharedModule,
        ApolloTestingModule,
        ReactiveFormsModule,
      ],
      schemas: [CUSTOM_ELEMENTS_SCHEMA],
      providers: [
        { provide: PlaygroundService, useValue: appService },
        { provide: 'Window', useValue: window },
        Apollo,
      ],
    }).compileComponents();
  });

  beforeEach(() => {
    fixture = TestBed.createComponent(HomeComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});

Source File: leverage.module.ts From 1x.ag with MIT License

6 votes

@NgModule({
    declarations: [LeverageComponent, CreatePositionComponent, MyPositionsComponent, LeverageChartDialogComponent],
    imports: [
        CommonModule,
        LeverageRoutingModule,
        FormsModule,
        ButtonsModule,
        FontAwesomeModule,
        TooltipModule.forRoot(),
        OiUiModule,
        ReactiveFormsModule,
        LoadingSpinnerModule,
        NgbAlertModule,
        ChartsModule
    ],
    entryComponents: [
        LeverageChartDialogComponent
    ]
})
export class LeverageModule {
}

Source File: app.module.ts From gnosis.1inch.exchange with MIT License

6 votes

@NgModule({
    declarations: [
        AppComponent,
        SlippageSettingsComponent,
        GasSettingsComponent
    ],
    imports: [
        BrowserModule,
        AppRoutingModule,
        HttpClientModule,
        BrowserAnimationsModule,
        MatButtonModule,
        MatSelectModule,
        FormsModule,
        ReactiveFormsModule,
        MatInputModule,
        MatFormFieldModule,
        MatTooltipModule,
        MatIconModule,
        MatRadioModule,
        NgxWebstorageModule.forRoot(),
        MatAutocompleteModule,
        NgxMatSelectSearchModule,
        MatExpansionModule,
        FontAwesomeModule
    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule {
}

Source File: app.component.spec.ts From homebridge-nest-cam with GNU General Public License v3.0

6 votes

describe('AppComponent', () => {
  beforeEach(async () => {
    await TestBed.configureTestingModule({
      declarations: [AppComponent, LoginComponent, ProgressBarComponent],
      imports: [FormsModule, ReactiveFormsModule],
    }).compileComponents();
  });

  it('should create the app', () => {
    const fixture = TestBed.createComponent(AppComponent);
    const app = fixture.componentInstance;
    expect(app).toBeTruthy();
  });

  it(`should have as title 'homebridge-ui'`, () => {
    const fixture = TestBed.createComponent(AppComponent);
    const app = fixture.componentInstance;
    expect(app.title).toEqual('homebridge-ui');
  });
});

Source File: connect.module.ts From xBull-Wallet with GNU Affero General Public License v3.0

6 votes

@NgModule({
  declarations: [
    ConnectDashboardComponent,
    ConnectAccountComponent,
    SignRequestComponent,
    ConnectNoWalletComponent,
  ],
  imports: [
    CommonModule,
    ConnectRoutingModule,
    NzImageModule,
    NzButtonModule,
    NzListModule,
    NzStepsModule,
    NzCardModule,
    NzSelectModule,
    ReactiveFormsModule,
    SharedPipesModule,
    NzTreeSelectModule,
    BackgroundModule,
    TranslationModule.forChild(),
  ],
  providers: [
    ConnectQuery,
    ConnectStore,
    ConnectService,
  ]
})
export class ConnectModule { }

Source File: staking.module.ts From rubic-app with GNU General Public License v3.0

6 votes

@NgModule({
  declarations: [
    StakingContainerComponent,
    StakeComponent,
    StakingTokensComponent,
    WithdrawComponent,
    SwapModalComponent,
    StakingStatisticsComponent,
    StakingInfoComponent,
    StakeButtonContainerComponent,
    StakingRoundComponent,
    StakingPageComponent,
    WithdrawButtonContainerComponent,
    BridgeStakeNotificationComponent
  ],
  imports: [
    CommonModule,
    RouterModule,
    ReactiveFormsModule,
    StakingRoutingModule,
    SharedModule,
    InlineSVGModule,
    TuiTabsModule,
    TuiHostedDropdownModule,
    TuiSelectModule,
    TuiDataListWrapperModule,
    TuiTextfieldControllerModule,
    TuiHintControllerModule,
    TuiHintModule,
    TuiProgressModule,
    TuiLoaderModule
  ],
  providers: [StakingService, StakingApiService, StakingRoundResolver]
})
export class StakingModule {}

Source File: dynamic-forms.module.ts From ng-devui-admin with MIT License

6 votes

@NgModule({
  declarations: [
    DynamicFormsComponent,
    RadioWidget, 
    TextAreaWidget, 
    TextInputWidget,
    CheckboxWidget,
    SelectWidget,
    TagsInputWidget,
    ToggleWidget
  ],
  imports: [
    CommonModule,
    FormsModule,
    ReactiveFormsModule,
    FormModule,
    RadioModule, 
    SelectModule, 
    TextareaModule, 
    ButtonModule,
    TextInputModule, 
    CheckBoxModule,
    ToggleModule,
    TagsInputModule
  ],
  exports: [
    DynamicFormsComponent,
    RadioWidget, 
    TextAreaWidget, 
    TextInputWidget,
    CheckboxWidget,
    SelectWidget,
    TagsInputWidget,
    ToggleWidget
  ]
})
export class DynamicFormsModule {

}

Source File: common-share.module.ts From dbm with Apache License 2.0

6 votes

@NgModule({
  imports: [
    NgZorroAntdModule,
    TranslateModule,
    CodemirrorModule,
    FormsModule,
    CommonModule,
    ServiceModule,
    ChartModule,
    TableModule,
    MomentModule,
    ReactiveFormsModule,
    EllipsisModule
  ],
  declarations: [
    DdlQueryComponent,
    BasicTableComponent,
    LineChartsComponent,
    EmptyAntdComponent,
    DrividerAntdComponent,
    CreateSnippetComponent
  ],
  providers: [
    ClipboardComService
  ],
  exports: [
    DdlQueryComponent,
    BasicTableComponent,
    LineChartsComponent,
    EmptyAntdComponent,
    DrividerAntdComponent,
    CreateSnippetComponent
  ]
})
export class CommonShareModule {
}

Source File: app.module.ts From ngx-colors with MIT License

6 votes

@NgModule({
  declarations: [
    AppComponent,
    CustomTriggerExampleComponent,
    DocumentViewerComponent,
    HideElementsExampleComponent,
    CustomPaletteExampleComponent,
    ChangeAcceptLabelExampleComponent
  ],
  imports: [
    HighlightModule,
    BrowserModule,
    ReactiveFormsModule,
    BrowserAnimationsModule,
    AppRoutingModule,
    NgxColorsModule,
    MatTabsModule,
    FormsModule,
    HttpClientModule,
    MatInputModule,
    MatSlideToggleModule,
    MatButtonModule
  ],
  providers: [
    {
      provide: HIGHLIGHT_OPTIONS,
      useValue: {
        languages: getHighlightLanguages()
      }
    }
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

Source File: app.module.ts From Collab-Blog with GNU General Public License v3.0

6 votes

@NgModule({
  declarations: [
    AppComponent,
    BlogListComponent,
    AddBlogComponent,
    NavbarComponent,
    WelcomePageComponent,
    ViewBlogComponent,
    UpdateBlogComponent,
    
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    HttpClientModule,
    ReactiveFormsModule,
    MatButtonModule,
    MatCardModule,
    MatInputModule,
    MatListModule,
    MatToolbarModule,
    MatSliderModule,
    MatMenuModule,
    MatFormFieldModule,
    BrowserAnimationsModule,
    FormsModule,
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Source File: date-field.module.ts From canopy with Apache License 2.0

6 votes

@NgModule({
  imports: [
    CommonModule,
    ReactiveFormsModule,
    LgLabelModule,
    LgInputModule,
    LgValidationModule,
    LgMarginModule,
    LgFocusModule,
  ],
  declarations: [ LgDateFieldComponent ],
  exports: [ LgDateFieldComponent ],
  entryComponents: [ LgDateFieldComponent ],
})
export class LgDateFieldModule {}

Source File: app.module.ts From master-frontend-lemoncode with MIT License

6 votes

@NgModule({
  declarations: [
    AppComponent,
    MenuComponent,
    UserListComponent,
    HighlightDirective,
    SearchByLoginPipe
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    FormsModule,
    ReactiveFormsModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Source File: app.module.ts From mslearn-live-azure-fundamentals with MIT License

6 votes

@NgModule({
  declarations: [
    AppComponent,
    ProductsListComponent,
    AdminProductsListComponent,
    ProductComponent,
    AdminProductComponent,
    AboutComponent,
    NavmenuComponent,
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    AppRoutingModule,
    ReactiveFormsModule,
    RouterModule.forRoot([
      { path: 'home', component: AboutComponent },
      { path: 'product/:productId', component: ProductComponent },
      { path: 'products', component: ProductsListComponent },
      { path: 'admin/products', component: AdminProductsListComponent },
      { path: 'admin/product/:productId', component: AdminProductComponent },
      { path: '**', redirectTo: 'home' }
    ])
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Source File: app.module.ts From mylog14 with GNU General Public License v3.0

6 votes

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(),
    AppRoutingModule,
    HttpClientModule,
    TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,
        useFactory: (LanguageLoader),
        deps: [HttpClient],
      }
    }),
    CoreModule,
    SharedModule,
    LottieModule.forRoot({ player: playerFactory }),
    ReactiveFormsModule,
    FormlyModule.forRoot(),
    FormlyIonicModule
  ],
  providers: [
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

Source File: app.module.ts From acnh.directory with MIT License

6 votes

@NgModule({
  declarations: [
    AppComponent,
    PrivacyComponent,
    DirectoryComponent
  ],
  imports: [
    HttpClientModule,
    BrowserModule,
    AppRoutingModule,
    FormsModule,
    ReactiveFormsModule,
    NgMultiSelectDropDownModule.forRoot()
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Source File: app.module.ts From leapp with Mozilla Public License 2.0

6 votes

@NgModule({
  declarations: [AppComponent, TrayMenuComponent],
  imports: [
    ComponentsModule,
    MatSnackBarModule,
    BrowserModule,
    BrowserAnimationsModule,
    AppRoutingModule,
    HttpClientModule,
    FormsModule,
    ReactiveFormsModule,
    NgSelectModule,
    LayoutModule,
    TooltipModule.forRoot(),
    ModalModule.forRoot(),
    ToastrModule.forRoot(),
  ],
  entryComponents: [ConfirmationDialogComponent, InputDialogComponent],
  providers: [{ provide: ErrorHandler, useClass: ErrorService }],
  bootstrap: [AppComponent],
})
export class AppModule {}

Source File: signin.component.spec.ts From barista with Apache License 2.0

6 votes

describe('SigninComponent', () => {
  let component: SigninComponent;
  let fixture: ComponentFixture<SigninComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [
        RouterTestingModule,
        AppMaterialModule,
        FormsModule,
        ReactiveFormsModule,
        HttpClientModule,
        AppComponentsModule,
        StoreModule.forRoot({}),
        EffectsModule.forRoot([]),
        EntityDataModule.forRoot(entityConfig),
        EntityStoreModule,
      ],
      declarations: [SigninComponent],
      providers: [AuthService],
    }).compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(SigninComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});

Source File: app.module.ts From Angular-Cookbook with MIT License

6 votes

@NgModule({
  declarations: [
    AppComponent,
    VersionControlComponent,
    VcLogsComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    ReactiveFormsModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Source File: app.module.ts From pantry_party with Apache License 2.0

6 votes

@NgModule({
    bootstrap: [
        AppComponent
    ],
    imports: [
        NativeScriptModule,
        AppRoutingModule,
        NativeScriptUISideDrawerModule,
        NativeScriptHttpClientModule,
        NativeScriptAnimationsModule,
        ReactiveFormsModule,
        NativeScriptFormsModule,
        NativeScriptMaterialBottomSheetModule.forRoot()
    ],
    declarations: [
        AppComponent,
        AppDrawerComponent
    ],
    schemas: [
        NO_ERRORS_SCHEMA
    ]
})
export class AppModule { }

Source File: admin.module.ts From App with MIT License

6 votes

@NgModule({
	declarations: [
		AdminComponent,
		AdminUsersComponent,
		AdminReportsComponent,
		AdminModQueueComponent,
		AuditLogEntryComponent
	],
	imports: [
		CommonModule,
		UtilModule,
		ReactiveFormsModule,
		MaterialModule,
		AdminRoutingModule
	],
	exports: [
		AuditLogEntryComponent
	]
})
export class AdminModule { }

Source File: calculator.module.ts From colo-calc with Do What The F*ck You Want To Public License

6 votes

@NgModule({
  imports: [
    CommonModule,
    FieldModule,
    FormsModule,
    HeroSelectDialogModule,
    ShareDialogModule,
    HelpDialogModule,
    CreditsDialogModule,
    PartyModule,
    PipesModule,
    MatSelectModule,
    ReactiveFormsModule,
    MatFormFieldModule,
    MatIconModule,
    AttackOrderModule,
  ],
  declarations: [CalculatorComponent],
  exports: [CalculatorComponent]
})
export class CalculatorModule { }

Source File: item-details.module.ts From VIR with MIT License

6 votes

@NgModule({
  declarations: [ItemDetailsComponent],
  imports: [
    CommonModule,
    MatButtonModule,
    MatIconModule,
    MatInputModule,
    MatFormFieldModule,
    FormsModule,
    ColorPickerModule,
    MatCheckboxModule,
    MatAutocompleteModule,
    ReactiveFormsModule,
    MatTooltipModule,
    MatDatepickerModule,
    MatSelectModule,
    MatButtonToggleModule,
  ],
  entryComponents: [ItemDetailsComponent],
  exports: [ItemDetailsComponent],
})
export class ItemDetailsModule {
}

Source File: common-ui.module.ts From WowUp with GNU General Public License v3.0

6 votes

@NgModule({
  declarations: [
    ProgressSpinnerComponent,
    ProgressButtonComponent,
    ConfirmDialogComponent,
    AlertDialogComponent,
    AnimatedLogoComponent,
    ExternalUrlConfirmationDialogComponent,
    PatchNotesDialogComponent,
    ProgressButtonComponent,
    TelemetryDialogComponent,
    ConsentDialogComponent,
    CellWrapTextComponent,
    CenteredSnackbarComponent,
    ClientSelectorComponent,
    CurseMigrationDialogComponent,
    WebViewComponent,
  ],
  imports: [CommonModule, FormsModule, TranslateModule, MatModule, PipesModule, ReactiveFormsModule],
  exports: [
    ProgressSpinnerComponent,
    ProgressButtonComponent,
    ConfirmDialogComponent,
    AlertDialogComponent,
    AnimatedLogoComponent,
    ExternalUrlConfirmationDialogComponent,
    PatchNotesDialogComponent,
    ProgressButtonComponent,
    TelemetryDialogComponent,
    ConsentDialogComponent,
    CellWrapTextComponent,
    CenteredSnackbarComponent,
    ClientSelectorComponent,
    CurseMigrationDialogComponent,
    WebViewComponent,
  ],
})
export class CommonUiModule {}

Source File: quantity-input.module.ts From nghacks with MIT License

6 votes

@NgModule({
  declarations: [QuantityInputComponent],
  imports: [
    CommonModule,
    MatButtonModule,
    MatIconModule,
    ReactiveFormsModule
  ],
  exports: [QuantityInputComponent]
})
export class QuantityInputModule { }

Source File: auth.module.ts From ngx-admin-dotnet-starter with MIT License

6 votes

@NgModule({
  declarations: [...PIPES, ...COMPONENTS],
  imports: [
    AuthRoutingModule,
    ReactiveFormsModule,
    CommonModule,
    ComponentsModule,
    ...NB_MODULES,
    NbAuthModule.forRoot(authOptions),
  ],
  exports: [...PIPES],
  providers: [
    NbSecurityModule.forRoot({
      accessControl: authSettings,
    }).providers,
    {
      provide: NbRoleProvider, useClass: RoleProvider,
    },
    {
      provide: NbTokenLocalStorage, useClass: NbTokenLocalStorage,
    },
  ],
})
export class AuthModule {
  static forRoot(): ModuleWithProviders<AuthModule> {
    return {
      ngModule: AuthModule,
      providers: [
        { provide: NB_AUTH_TOKEN_INTERCEPTOR_FILTER, useValue: filterInterceptorRequest },
        { provide: HTTP_INTERCEPTORS, useClass: NbAuthJWTInterceptor, multi: true },
        { provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true },
        ...GUARDS],
    };
  }
}

Source File: date-picker.module.ts From alauda-ui with MIT License

6 votes

@NgModule({
  imports: [
    CommonModule,
    InputModule,
    ButtonModule,
    TooltipModule,
    ReactiveFormsModule,
    FormsModule,
    TimePickerModule,
    IconModule,
    I18nModule,
  ],
  declarations: [...COMPONENTS],
  exports: [...COMPONENTS],
})
export class DatePickerModule {}

Source File: shared.module.ts From alura_angular_rxjs_1 with MIT License

6 votes

@NgModule({
  imports: [
    CommonModule,
    PoModule,
    MessagesModule,
    NoDataModule,
    ReactiveFormsModule,
    AuthorizationModule,
  ],
  exports: [
    PoModule,
    MessagesModule,
    NoDataModule,
    ReactiveFormsModule,
    AuthorizationModule,
  ],
})
export class SharedModule {}

Source File: todo-search-form.component.spec.ts From angular-padroes-e-boas-praticas with MIT License

6 votes

describe('TodoSearchFormComponent', () => {
  let component: TodoSearchFormComponent;
  let fixture: ComponentFixture<TodoSearchFormComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ TodoSearchFormComponent ],
      imports: [ ReactiveFormsModule ]
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(TodoSearchFormComponent);
    component = fixture.componentInstance;
    component.todoSearchForm = new FormControl();
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });

  it('todoSearchForm should be valid', () => {
    expect(component.todoSearchForm).toBeTruthy();
  });
});

@angular/forms#ReactiveFormsModule TypeScript Examples