3

I have an angular-cli application and need to include tooltip for a button here is my app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import {BenefitsManagementModule} from './benefits-management/benefits-management.module';
import { AppComponent } from './app.component';
import { LoginComponent } from './login/login.component';
import { AuthService } from './auth/auth.service';
import {AppRoutingModule} from './app-routing.module';
import { TooltipModule } from 'ngx-bootstrap';

@NgModule({
  declarations: [
    AppComponent,
    LoginComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    BenefitsManagementModule,
    AppRoutingModule,
     TooltipModule.forRoot()
  ],
  providers: [
    AuthService
  ],
  bootstrap: [AppComponent]
})
export class AppModule { };

here is my html for button

<button type="submit" [disabled]="!benefitScheduleForm.valid" class="btn btn-md btn-primary" style="float:left;">Add</button> <button type="button" tooltip="mytooltip" class="btn btn-md btn-primary" style="float:right;" (click)="cancel()">Cancel</button> </div>

Can anybody help me out?

4

2 回答 2

2

我面临着同样的问题。解决方案是将 opacity 属性设置为 100。

.tooltip {
  opacity: 100;
}

于 2017-10-26T07:10:26.130 回答
0

您使用的是哪个版本的 Angular？

您在 Chrome /ng serve控制台中看到任何内容吗？

这可能是由于 Angular 版本太旧。确保您使用的是最新版本的 Angular（至少 4.x）和 ngx-bootstrap。

尽管 plunkr 确实会有所帮助，但我认为您发布的代码没有任何问题。该cancel()方法是否实际存在于您的组件中？

最好的

于 2017-09-13T15:39:29.473 回答