如何在角度2+中制作自定义加载按钮组件?

时间:2018-03-15 19:51:46

标签: angular

我的angular 4应用程序中的几乎所有按钮都具有与之关联的异步操作。我正在点击按钮时手动为每个按钮添加一个加载微调器,并在操作结束时将其删除。

我已经意识到太晚了,如果我只是有一个自定义按钮组件来接受异步事件处理程序并自己添加/删除了微调器,那么我可以节省很多时间重构等。

我对角度2+相对较新,我想知道解决这个问题的好方法是什么。我应该做一个自定义组件吗?或者只是一个自定义指令?我如何要求这样的组件/指令的客户端为我提供异步事件处理程序?我是否在正常的事件处理中使用自定义属性或某种包装?

我不是要求代码,只是要使用正确的功能,我可以从那里开始。

编辑:

通过在相应组件中通过布尔属性显示/隐藏图标元素,当前为每个按钮实现了加载微调器功能。

2 个答案:

答案 0 :(得分:1)

如果您构建自定义组件,则可以使用input属性从父/客户端组件和output属性获取任何配置信息以传回任何事件。

以下是使用我的一个自定义组件的客户端代码示例:

        <mh-criteria class='col-md-10'
            [displayDetail]='includeDetail'
            [hitCount]='filteredMovies?.length'
            (valueChange)='onValueChange($event)'>
        </mh-criteria>

以下是相关组件中的声明:

export class CriteriaComponent implements OnInit {

  @Input() displayDetail: boolean;
  @Input() hitCount: number;

  @Output() valueChange: EventEmitter<string> =
              new EventEmitter<string>();

  // more code here
}

答案 1 :(得分:1)

编辑回答

ModelStateDictionary