Python和角度不同意变量值

Question

所以，为了恰当地构建这个框架，我在这里继承了一个代码库，但我对 Angular 没有深入的了解。基本上有一个应用程序可以根据数据库导入是否完成来显示或隐藏加载 gif。

尽管出于某种原因，尽管数据集导入已完成，但 angular 无法识别它。下面的简化代码示例：

<h4>Status
    <small ng-hide="dataset.failed">{{ dataset.status }}</small>
    <img class="pull-right" ng-hide="(dataset.import_complete || dataset.failed)" src="/url" height="12">
</h4>
    <span>{{ dataset.import_complete }}</span>

我为调试目的添加的 span，但实际上 span 显示 True，而上面的 img 标签仍在显示。这意味着 Angular 正在将 dataset.import_complete || dataset.failed 评估为 False。

为什么会发生这种情况？任何有助于调试此行为的建议将不胜感激。

更新： 我认为这里的想法是这里发生了一些错误的类型检查。具体来说，以下似乎是正确的：

# Always evaluates to True, regardless of import_complete
dataset.import_complete == True
# Always evaluates to False, again, regardless of import_complete
dataset.import_complete == 'True'
# result is bool, as it should be, making this only more baffling
type(dataset)

另外，这里有一点后端，但可能不是很有帮助：

@route(bp, '/dataset/<int:dataset_id>', methods=["GET", "POST"])

def 数据集（dataset_id）： """返回数据集管理页面"""

dataset = Dataset.query.get_or_404(dataset_id)

return render_template(
    'manage/dataset.html',
    dataset=dataset,
)

更多信息，这里是vars(dataset)的输出：

{'import_complete': True, 'failed': False, 'pending_deletion': False}

Answer 1

在 NG 运行之前，Jinja2 是否会对您的表达式进行插值？

不要忘记 Jinja 和 Angular 都使用相同的 {{ 和 }} 标记作为它们的语法。

在我看来，您使用 Jinja 来呈现该 HTML，如果该 HTML 也包含您的 AngularJS 代码，那么 {{ expr }} 在 AngularJS 在浏览器上运行之前由 Flask/Jinja 进行插值。

我的猜测是你在 HTML 中看到的 True，来自 Jinja2 渲染这个表达式（不是 Angular）

<span>{{ dataset.import_complete }}</span>

至少 key import_complete 是 Angular 应用 $scope 中 dataset JS 对象中的 undefined。 （因为someObject.undefinedKey == 'True' 会给JS 布尔值false）

$scope.dataset 对象很可能存在于您的 ng 应用程序中，但似乎 $scope.dataset 不包含密钥 import_complete（要使 ng-hide="dataset.import_complete" 工作，您需要 $scope.dataset.import_complete明确定义）

如何检查？

要确认实际上是 Jinja2 呈现了上述内容，请尝试通过将其保存为 curl 或 wget 来查看 HTML，您应该会看到它在静态 HTML 中没有带有 <span>{{ dataset.import_complete }}</span>运行 NG，但使用 <span>True</span>

如何解决

如果这是真的，那么try adapting more structured way this to your project, by separating the server/API and the client

否则，您可以change the tokens for your angular app to something else 进行快速修复，然后弄清楚如何将变量放入您的$scope（例如，在 Jinja 中渲染 $scope.dataset = {{dataset_json}}; 以将其放入 JS，这是您想要的 hack从长远来看要避免）

调试

如果这个<span>{{ dataset.import_complete }}</span> 显示True 作为输出，这确实表明键import_complete 实际上包含一个带有值"True" 的字符串，而不是JS 布尔值true

我重新审视了你的评论，你说你尝试了一些无济于事的事情

ng-hide="dataset.import_complete == 'True'"

这似乎是可能的，但我不知道如何调试它。

所以我建议你像这样查看dataset 对象的值

<p>{{dataset}}</p>或者<p>{{dataset | json}}</p>，那么你可以确定它的价值和类型

您还可以查看浏览器的开发工具 Network 选项卡，了解 Flask 后端已发送回 AngularJS 的内容。