在Angular中，data-toggle属性不起作用的原因是因为Angular使用了自己的事件绑定机制，而不是依赖于data-*属性来触发事件。

要解决这个问题，可以使用Angular提供的事件绑定语法来代替data-toggle属性。

以下是一个示例代码，展示了如何在Angular中使用事件绑定来替代data-toggle属性：

在HTML模板中：

Toggle
Content to be toggled

在组件类中：

import { Component } from '@angular/core';

@Component({
  selector: 'app-example',
  templateUrl: './example.component.html',
  styleUrls: ['./example.component.css']
})
export class ExampleComponent {
  isHidden: boolean = true;

  toggle() {
    this.isHidden = !this.isHidden;
  }
}

在这个例子中，我们使用了事件绑定语法(click)="toggle()"来绑定了按钮的点击事件。当按钮点击时，toggle()方法会被调用，并根据isHidden属性的值来切换内容的显示和隐藏。

通过这种方式，我们可以在Angular中实现与data-toggle类似的效果，而不依赖于Bootstrap的特定属性。