没有数据的角度模板加载？答案

【问题标题】：Angular template loading without data?没有数据的角度模板加载？
【发布时间】：2017-10-11 20:41:27
【问题描述】：

有一个非常奇怪的问题，我的模板加载时没有任何数据，但是当我刷新页面足够多次时，数据最终会加载。我不确定发生了什么或如何解决这个问题。我将在下面添加一些代码。如果您需要其他作品，请告诉我。

服务器：

  app.get('/api/listings/:listingId', auth.ensureAuthenticated, controllers.listings.show);

控制器：

function show(req, res) {
  db.Listing.findById(req.params.listingId, function(err, foundListing) {
    if(err) { console.log('listingsController.show error', err); }
    res.json(foundListing);
 });
}

Angular 控制器中的 Http 请求：

$http({
  method: 'GET',
  url: '/api/listings/'+$stateParams.listingId
}).then(function successCallback(json) {
  vm.listing = json.data;
}, function errorCallback(response) {
  console.log('There was an error getting the data', response);
});

我的一个模板：

<li class="list-group-item">
  <h4 class='inline-header'>Topic:</h4>
  <span>{{listingShowCtrl.listing.topic}}</a></span>

</li>

【问题讨论】：

editing 标志在哪里设置？
抱歉，这实际上来自我忘记删除的旧部分。编辑按钮被移动到另一个页面。我已经更新了。

标签： javascript angularjs model-view-controller

【解决方案1】：

这看起来像是一个竞争条件 - 这意味着 listing 尚不可用。 ng-if 将继续检查每个 $digest 周期并在可用时更新。

试试这个：

<li class="list-group-item" ng-if="listingShowCtrl.listing">
  <h4 class="inline-header">Topic:</h4>
  <span>{{listingShowCtrl.listing.topic}}</a></span>
</li>

【讨论】：

添加后，加载时我只是得到一个空白屏幕。如果我刷新 4 或 5 次，它最终会加载整个数据 + 模板，所以基本上做同样的事情。

【解决方案2】：

编辑：如果您尝试将其声明为范围变量，如下所示：$scope.listing = json.data;
您仍然无法在视图中看到数据吗？

【讨论】：

很抱歉造成混乱，但编辑标志来自旧版本，我忘记删除了。我已经更新了 html 并测试了代码。仍然在没有编辑标志的情况下做同样的事情
@Kenzo 如果你 console.log() vm.listing 变量，你总是得到你期望的数据吗？您是否考虑过将其设为可从视图访问的 $scope 变量？
是的，我总是得到我期望的数据，并且控制台日志每次都返回正确的数据。只是似乎没有立即加载。
我还是看不到数据。我确保将 $scope 也添加到控制器中。似乎有了这种变化，即使在多次刷新后它也根本不加载。
@Kenzo 那么我想我已经没有任何建议了，对此感到抱歉：/希望你能找到解决方案！