angularJs - 在用户在搜索字段中输入之前不会显示数据

Question

最终解决方案？看起来我的路由和控制器有点困惑。我的路由在我的控制器模块的文件中。我将我的 routeProvider 移动到主模块中，就像在教程示例中一样。我的控制器和我的 routeProvider 在同一个模块下。也许这让一切变得混乱。所以现在我在它自己的模块中有控制器，并且 routeProvider 在主模块下。这似乎已经解决了问题，而无需初始化搜索字段以强制绑定更新数据。

更新： 在页面加载时显示我的数据的解决方案是使用 旧版本 angularJs，或使用ng-Init 并将搜索字段初始化为空白。

我从 firebase 网站获取 JSON 数据以更新表格。我有一个有效的搜索字段。在我在搜索字段中输入内容之前，数据不会显示在表格中。我不知道为什么控制器完成获取数据后，数据不会立即显示在表格中。

注意：后端数据的链接现在已删除，我不想无限期地保留该数据库文件。

这里是 jsFiddle 代码的链接： Last Version jsFiddle

这是控制器的代码。

'use strict';
/* App Module */
// Create the module named 'testApp'
var testApp = angular.module('theTestApp', [
  'ngRoute',
  'testServices'
]);

'use strict';
/* Services */

var testServices = angular.module('testServices', []);

testServices.controller('CommonController',
    // function($scope, $http, $route) {
    function($scope, $http) {
    //access the customInput property using $route.current
    //var dbKey = $route.current.customInput;
    var dbKey = 'test-a-db-12345';
    var urlToDb = 'https://' + dbKey + '.firebaseio.com/rows/.json';
    $http.get(urlToDb).success(function(data) {
    $scope.UsedItems = data;
    });

});

如何让数据在加载后立即显示？

更新 1：我假设数据已经存在，但是在搜索字段中输入内容会触发过滤器，然后显示数据。它显示为已过滤。

更新 2：我正在阅读关于 $Watch 的内容，并且不断有事件循环在监听事件。当在搜索框中按下某个键时，如果发生更改，绑定 {{name}} 会更新。在这种情况下，搜索输入字段的内容已更改。所以这个问题似乎与绑定何时更新有关，而不是与数据是否被检索有关。

更新 3： 此版本的代码运行。它在呈现页面时加载数据。这是 jsBins 中的一个工作示例。

更新 4： 从 angularJs 1.2.0 版开始，行为发生了变化。 1.0.8、1.0.7 版会在页面加载时立即显示我的数据，1.2.0 版不会！我只是碰巧正在使用使用 1.0.7 的 jsBins，它开始工作了。直到我开始比较差异时才知道为什么。希望有办法让它在较新的版本中工作。

jsBins Working Example

Answer 1

问题是theSearch.Txt 是空的。而你正在过滤。我的猜测是 Angular 在那一刻决定不让任何东西通过，因此不显示任何东西。

你应该做什么：

用空格填充的字符串初始化变量。 （即''）

这是一个有效的jsFiddle。

我在这里使用了 ngInit。但那是因为你决定链接？控制器而不是将其放入脚本标签中。我建议下次你宁愿花额外的精力粘贴它，因为使用ngInit 指令让我感觉像使用eval。

Answer 2

试试

$scope.$apply(function(){
    $scope.UsedItems=data;
}