Question

我在下面尝试编码从模态组件到父组件的传递数据。

的package.json

static func deleteFiledInDocDirectory(){

        let fileManager = FileManager.default
        let tempFolderPath = NSTemporaryDirectory()
        do {
            let filePaths = try fileManager.contentsOfDirectory(atPath: tempFolderPath)
            for filePath in filePaths {
                try fileManager.removeItem(atPath: tempFolderPath + filePath)
            }
        } catch {
            print("Could not clear temp folder: \(error)")
        }
    }

app.component.html

"@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.3"

app.component.ts

<button class="btn btn-primary" (click)="openModal()">Open</button>

应用-modal.component.html

import { NgbModal, NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';

export class AppComponent {

   constructor(private modalService: NgbModal) { }

    openModal() {
        const modalRef = this.modalService.open(AppModalComponent);
    }
}

应用-modal.component.ts

<h1>{{data}}</h1>
<button class="btn btn-primary" (click)="addMe()"></button>

发出后，如何在父组件（app.component）中获取数据??

Answer 1

您可以订阅emitService @Output，如下所示：

openModal() {
     const modalRef = this.modalService.open(AppModalComponent);
     modalRef.componentInstance.emitService.subscribe((emmitedValue) => {
         // do sth with emmitedValue
     });
}

虽然上述方法有效，但请注意，通常使用要返回的值关闭模式更容易。这将解决modalRef上可用的承诺。 https://stackoverflow.com/a/43614501/1418796

中的更多详细信息

如何使用角度4中的ng-bootstrap将数据模态组件传递给父组件

1 个答案: