Question

我已经下载了此模板，但是找不到有关如何使用模式的任何文档。我玩了一下，发现了一些有关模态的文件，所以我认为它们是可用的但被隐藏了。我想知道如何调用此模式或在HTML中编写代码

这是代码

modal-config.d.ts

import { Injector } from '@angular/core';
/**
 * Represent options available when opening new modal windows.
 */
export interface NgbModalOptions {
    /**
     * Sets the aria attribute aria-labelledby to a modal window.
     *
     * @since 2.2.0
     */
    ariaLabelledBy?: string;
    /**
     * Whether a backdrop element should be created for a given modal (true by default).
     * Alternatively, specify 'static' for a backdrop which doesn't close the modal on click.
     */
    backdrop?: boolean | 'static';
    /**
     * Function called when a modal will be dismissed.
     * If this function returns false, the promise is resolved with false or the promise is rejected, the modal is not
     * dismissed.
     */
    beforeDismiss?: () => boolean | Promise<boolean>;
    /**
     * To center the modal vertically (false by default).
     *
     * @since 1.1.0
     */
    centered?: boolean;
    /**
     * An element to which to attach newly opened modal windows.
     */
    container?: string;
    /**
     * Injector to use for modal content.
     */
    injector?: Injector;
    /**
     * Whether to close the modal when escape key is pressed (true by default).
     */
    keyboard?: boolean;
    /**
     * Size of a new modal window.
     */
    size?: 'sm' | 'lg';
    /**
     * Custom class to append to the modal window
     */
    windowClass?: string;
    /**
     * Custom class to append to the modal backdrop
     *
     * @since 1.1.0
     */
    backdropClass?: string;
}
/**
* Configuration object token for the NgbModal service.
* You can provide this configuration, typically in your root module in order to provide default option values for every
* modal.
*
* @since 3.1.0
*/
export declare class NgbModalConfig implements NgbModalOptions {
    backdrop: boolean | 'static';
    keyboard: boolean;
}

这是组件

import {Component, ViewChild} from '@angular/core';
import {ModalDirective} from 'ngx-bootstrap/modal';

@Component({
  templateUrl: 'modals.component.html'
})
export class ModalsComponent {
  @ViewChild('myModal') public myModal: ModalDirective;
  @ViewChild('largeModal') public largeModal: ModalDirective;
  @ViewChild('smallModal') public smallModal: ModalDirective;
  @ViewChild('primaryModal') public primaryModal: ModalDirective;
  @ViewChild('successModal') public successModal: ModalDirective;
  @ViewChild('warningModal') public warningModal: ModalDirective;
  @ViewChild('dangerModal') public dangerModal: ModalDirective;
  @ViewChild('infoModal') public infoModal: ModalDirective;
}

NgBActiveModal

import { ComponentRef } from '@angular/core';
import { NgbModalBackdrop } from './modal-backdrop';
import { NgbModalWindow } from './modal-window';
import { ContentRef } from '../util/popup';
/**
 * A reference to an active (currently opened) modal. Instances of this class
 * can be injected into components passed as modal content.
 */
export declare class NgbActiveModal {
    /**
     * Closes the modal with an optional 'result' value.
     * The 'NgbMobalRef.result' promise will be resolved with provided value.
     */
    close(result?: any): void;
    /**
     * Dismisses the modal with an optional 'reason' value.
     * The 'NgbModalRef.result' promise will be rejected with provided value.
     */
    dismiss(reason?: any): void;
}
/**
 * A reference to a newly opened modal returned by the 'NgbModal.open()' method.
 */
export declare class NgbModalRef {
    private _windowCmptRef;
    private _contentRef;
    private _backdropCmptRef?;
    private _beforeDismiss?;
    private _resolve;
    private _reject;
    /**
     * The instance of component used as modal's content.
     * Undefined when a TemplateRef is used as modal's content.
     */
    readonly componentInstance: any;
    /**
     * A promise that is resolved when the modal is closed and rejected when the modal is dismissed.
     */
    result: Promise<any>;
    constructor(_windowCmptRef: ComponentRef<NgbModalWindow>, _contentRef: ContentRef, _backdropCmptRef?: ComponentRef<NgbModalBackdrop>, _beforeDismiss?: Function);
    /**
     * Closes the modal with an optional 'result' value.
     * The 'NgbMobalRef.result' promise will be resolved with provided value.
     */
    close(result?: any): void;
    private _dismiss;
    /**
     * Dismisses the modal with an optional 'reason' value.
     * The 'NgbModalRef.result' promise will be rejected with provided value.
     */
    dismiss(reason?: any): void;
    private _removeModalElements;
}

这是另一个

import { ApplicationRef, ComponentFactoryResolver, Injector, RendererFactory2 } from '@angular/core';
import { ScrollBar } from '../util/scrollbar';
import { NgbModalRef } from './modal-ref';
export declare class NgbModalStack {
    private _applicationRef;
    private _injector;
    private _document;
    private _scrollBar;
    private _rendererFactory;
    private _windowAttributes;
    private _backdropAttributes;
    private _modalRefs;
    private _windowCmpts;
    private _activeWindowCmptHasChanged;
    constructor(_applicationRef: ApplicationRef, _injector: Injector, _document: any, _scrollBar: ScrollBar, _rendererFactory: RendererFactory2);
    open(moduleCFR: ComponentFactoryResolver, contentInjector: Injector, content: any, options: any): NgbModalRef;
    dismissAll(reason?: any): void;
    hasOpenModals(): boolean;
    private _attachBackdrop;
    private _attachWindowComponent;
    private _applyWindowOptions;
    private _applyBackdropOptions;
    private _getContentRef;
    private _createFromTemplateRef;
    private _createFromString;
    private _createFromComponent;
    private _registerModalRef;
    private _registerWindowCmpt;
}

我试图找到CSS，但是它们太多了

我希望有人可以帮助我这是关于他如何编码的代码

<button type="button" class="btn btn-default" placement="top"
  ngbPopover="This is a very beautiful popover, show some love.">
    Popover on top
  </button>

我正在尝试使其像ngbModal =“ something？”

如何在Angular 7中使用此模态？

0 个答案: