AngularJS |仅在满足条件时如何呈现 HTML 元素（指令）？答案

【问题标题】：AngularJS | How to render a HTML element(directive) only when condition is met?AngularJS |仅在满足条件时如何呈现 HTML 元素（指令）？
【发布时间】：2019-12-25 08:48:46
【问题描述】：

我正在处理一个AngularJS(1.4) 项目，我想在其中加载特定条件下的指令。

这个指令在加载时调用很少的 API 并显示一些 HTML 元素。

我只想在满足这些条件时调用这些 API。

如果条件不满足，我尝试了以下操作：

使用ng-if，它不显示指令，而是调用API。
使用ng-show，它不显示指令，而是调用API。

我知道ng-if 首先添加指令，然后在不满足条件时将其删除。这里在加载指令时，正在调用 API。

有没有办法解决这个问题？

【问题讨论】：

你试过ngSwitchWhen了吗？ ng-if 或 ng-show 不会限制 API 调用，因为您必须从控制器级别进行限制。
根据我的经验，如果不满足条件，ng-if 不应运行您的代码。如果您添加代码演示以更好地理解问题，那就更好了。但是，您可以使用 $compile 动态创建元素
当问题不包含错误代码时，很难帮助解决代码问题。

标签： javascript angularjs angularjs-directive

【解决方案1】：

我知道ng-if先添加指令，如果不满足条件则将其删除。

当条件为true 时，ng-if 将元素及其子元素添加到 DOM。如果条件更改为false，AngularJS 框架会从 DOM 中删除该元素。如果条件最初是 false 并且永远不会更改为 true，则永远不会将元素添加到 DOM。元素呈现为注释节点。

【讨论】：