大佬教程收集整理的这篇文章主要介绍了angular – Ng-bootstrap不渲染,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
<div class="btn-holder"> <a (click)="this.open()" class="btn btn-success text-uppercase">Edit My Profile</a> </div>
模块:
imports: [BrowserModule,httpR_554_11845@odule,RouterModule.forRoot(appRoutes),NgbModule.forRoot(),EditProfileComponent ],
零件:
import {Component} from "@angular/core"; @Component({ SELEctor: 'edit-profile',templateUrl: './editProfile.html' }) export class EditProfileComponent{ constructor(){ } submitForm(){ } }
问题是我不知道如何让它工作,因为文档含糊不清.建议吗?
我尝试过以下方法:
@Component({ SELEctor: 'edit-profile',templateUrl: './editProfile.html' }) export class EditProfileComponent{ closeResult: String; constructor(private modalservice: NgbModal){ } open(content) { this.modalservice.open(content).result.then((result) => { this.closeResult = `Closed with: ${result}`; },(reason) => { this.closeResult = `Dismissed ${this.getDismissReason(reason)}`; }); } private getDismissReason(reason: any): String { if (reason === ModalDismissReasons.ESC) { return 'by pressing ESC'; } else if (reason === ModalDismissReasons.BACKDROP_CLICK) { return 'by clicking on a BACkdrop'; } else { return `with: ${reason}`; } } }
HTML:
<a (click)="open(content)" class="btn btn-success text-uppercase">Edit My Profile</a> </div>
单击按钮时控制台出错:
ERROR TypeError: _co.open is not a function at Object.eval [as handleEvent] (ProfileComponent.html:46) at handleEvent (core.es5.js:12047) at callWithDebugContext (core.es5.js:13508) at Object.debugHandleEvent [as handleEvent] (core.es5.js:13096) at dispatchEvent (core.es5.js:8659) at core.es5.js:9270 at HTMLAnchorElement.<anonymous> (platform-browser.es5.js:2668) at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:424) at Object.onInvokeTask (core.es5.js:3924) at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:423)
我看过plunker示例,但是当我实现它们时,它似乎打破了我的应用程序.我将组件和依赖项添加到app.module.
建议吗?
npm install bootstrap –save
在Angular-cli.json中
"styles": [ "styles.css","../node_modules/bootstrap/dist/css/bootstrap.min.css" ],"scripts": ["../node_modules/jquery/dist/jquery.js","../node_modules/bootstrap/dist/js/bootstrap.min.js" ],
在组件中
import { Component } from '@angular/core'; declare var $:any; @Component({
有关如何导入第三方lib LINK的更多信息
工作模式 – LINK.
以上是大佬教程为你收集整理的angular – Ng-bootstrap不渲染全部内容,希望文章能够帮你解决angular – Ng-bootstrap不渲染所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。