Question

最近我开始使用ui-router来管理页面状态。

我注意到，当我第一次运行服务器时，内容在那里，但是如果我浏览页面或重新加载页面，内容就会消失。

我知道ui-router上存在一个错误，可能是造成此错误的原因。我更新了ui-router，但错误仍然存在。

有人设法找到了解决方案或解决了该解决方案吗？

编辑----

我的调查使我相信，这与ui-router无关，而与应用程序完成承诺所花费的时间更多有关。因为我会在jQuery的setTimeout上收到违规警告

Answer 1

因此，我在上次编辑的部分正确内容是这个答案； jQuery与我的问题有关（通过使用Promise检索数据），但是它也与ui路由器的工作方式有关：

在加载页面内容时，ui-router将使用GET请求提供的数据管理第一次加载（以及随后的重新加载）。

由于这是一个承诺，因此不能保证（尤其是随着数据库的增长）数据将及时存在以呈现页面。

为避免发生这种情况，请将resolve属性用作ngRoute的一部分。此属性允许在呈现DOM之前加载所有必需的数据。

如果您想了解更多信息，请点击以下链接：

https://medium.com/opinionated-angularjs/advanced-routing-and-resolves-a2fcbf874a1c

我的下面的代码：

App.js

'use strict';


 angular
    .module('knoweeApp', ['ui.router'])
    .config(['$stateProvider','$urlRouterProvider',function($stateProvider,$urlRouterProvider) {

        $stateProvider
            .state('home', {
                url:'/',
                templateUrl: 'views/user.html',
                controller: 'UserCtrl as user',
                resolve: {
                    user: function(userFinder) {
                        return userFinder.getUsers();
                    }
                }
            })

            .state('teacher', {
                url:'/teacher/:name',
                templateUrl: 'views/teacher.html',
                controller: 'TeacherCtrl as teacher'

            });

        $urlRouterProvider.otherwise('/');

    }]);

服务：userFinder

'use strict';

/**
 * @ngdoc service
 * @name knoweeApp.userFinder
 * @description
 * # userFinder
 * Service in the knoweeApp.
 */
angular.module('knoweeApp')
  .service('userFinder', function () {
    // AngularJS will instantiate a singleton by calling "new" on this function

    this.getUsers = function (){
        return $.get('users.json');
    };

  });

控制器：UserCtrl


'use strict';

angular.module('knoweeApp')
    .controller('UserCtrl', function (userFinder,user) {

    this.teachers = user;

    this.increment = function (item) {
        item.rating += 1;
    };

    this.decrement = function (item) {
        item.rating -= 1;
    };

});

希望这会有所帮助，如有疑问，请与我联系

AngularJS UI路由器-重新加载后视图消失

1 个答案: