ng-在数据准备就绪时重复

Question

我有一个有两个网页的网站：

1. 设置页面：包含如下所示的 JSON 内容的网页：

   {"来源"：["1"，"2"，"3"，"4"]}

2. 显示系统中所有已知"源"的网页。只需一个接一个地打印它们。

当我的应用程序加载时，我下载了源页面，并保存在我的范围内 $scope.Settings.Sources .

我的 AngularJS 代码：

$scope.getSettings = function (ID, successCallback, failureCallback)
{
    $scope.ID = ID;
    $http.get("/sources?ID=" + ID).then(function (response)
    {
        if (response.status == 200)
        {
            $scope.Settings = response.data;
            successCallback();
        }
        else
        {
            failureCallback();
        }
    });
}
function getSettings_success()
{
    // Ready to update the ng-repeat NOW.
}
function getSettings_error()
{
    alert('Error');
}
$scope.getSettings(1, getSettings_success, getSettings_error);

现在，当我准备好$scope.Settings.Sources时，我所要做的就是在特定的HTML模板中打印每个解决方案。正因为如此，我想使用ng-repeat来完成这项任务。像这样：

<div ng-init="sources=$scope.Settings.Sources">
    <ul>
        <li ng-repeat="source in sources">
            {{ source }}
        </li>
    </ul>
</div>

不幸的是，此代码不起作用。这是因为当页面加载时，$scope.Settings.Sources尚未准备就绪。因此，ng-repeat必须在下载"源"页面后运行。

这可能吗？如果是，如何？

Answer 1

在这种情况下，

您不应该使用ng-init，因为数据来自Ajax，并且您将空白对象分配给源。原因还没有回应。相反，我会直接在您的视图上使用Settings.Sources变量。

标记

<div>
    <ul>
        <li ng-repeat="source in Settings.Sources">
            {{ source }}
        </li>
    </ul>
</div>

旁注：$scope变量可以直接在角度指令中访问，则无需显式指定$scope