Question

我正在使用离子4.9.0。我想在警报中添加组件标签。但这不起作用。

这是我的警报代码。

async navigateTo(url)
  {
    let logoutAlert;
    if(url != 'logout')
      this.router.navigate(['/menu/' + url]);
    else
    {
      logoutAlert = await this.alertCtrl.create({
        message: "<logout></logout>"
      });
      await logoutAlert.present();
    }
  }

这是我的logout.component.ts文件

import { Component, OnInit } from '@angular/core';
import { NavController } from '@ionic/angular';

@Component({
  selector: 'logout',
  templateUrl: './logout.component.html',
  styleUrls: ['./logout.component.scss']
})
export class LogoutComponent implements OnInit {

  constructor(
    private navCtrl: NavController
  ){}

  ngOnInit() {
  }

  logout()
  {
    this.navCtrl.navigateRoot('/home');
  }
}

这是我的logout.component.html文件

<div>Are You sure?
  <button (click) = "logout()">Yes</button>
  <button>No</button>
</div>

其他建议也将不胜感激。谢谢。

Answer 1

离子警报不能使用自定义组件。在message中，您只能传递带有基本/核心HTML标记（例如string，strong，h1等的p，而不能传递自定义组件）。警报仅用于此目的，以提供最少和重要的信息。

如果您确实要在警报中使用自定义组件，则可以使用modal并将其设计为警报。

在警报Ionic 4中添加自定义组件标签

1 个答案: