angularjs - Angularjs没有使用正确的json文件重新加载页面 - Thinbug

Angularjs没有使用正确的json文件重新加载页面

时间：2014-07-28 14:55:40

标签： angularjs

我正在使用json存储网站的数据和语言术语，并根据所选语言加载适当的文件。问题是当我切换语言时，只有地址栏中的地址发生变化而不重新加载正确的json文件。

factory.js

app.factory('PostsFactory', function ($http, $q, $timeout) {
    var factory = {
        posts: false,
        find: function (lang) {
            var deferred = $q.defer();

            if (factory.posts !== false) {
                deferred.resolve(factory.posts);
            } else {
                $http.get(lang+'/json.js').success(function (data, status) {
                    factory.posts = data;
                    $timeout(function () {
                        deferred.resolve(factory.posts);
                    })

                }).error(function (data, status) {
                    deferred.reject('error')
                });
            }

            return deferred.promise;
        },
        get: function (id, lang) {
            var deferred = $q.defer();
            var post = {};
            var posts = factory.find(lang).then(function (posts) {
                angular.forEach(posts, function (value, key) {
                    if (value.id == id) {
                        post = value;
                    };
                });
                deferred.resolve(post);
            }, function (msg) {
                deferred.reject(msg);
            })

            return deferred.promise;
        }
    }

    return factory;
})

控制器

posts.js

app.controller('PostsCtrl', function ($scope, PostsFactory, $rootScope, $routeParams) {
    $rootScope.loading = true;
    lang = $routeParams.lang;
    PostsFactory.find(lang).then(function (posts) {

        $rootScope.loading = false;
        $scope.posts = posts;

    }, function (msg) {
        alert(msg);
    });
});

post.js

app.controller('PostCtrl', function ($scope, PostsFactory, $routeParams, $rootScope) {

    $rootScope.loading = true;

    SounanFactory.get($routeParams.id, $routeParams.lang).then(function (post) {
        $rootScope.loading = false;
        $scope.title = post.title;
        $scope.text = post.text;
        $scope.image = post.image;
        $scope.id = post.id;
    }, function (msg) {
        alert(msg);
    });
});

app.js

var app = angular.module('Posts', ['ngRoute']);

app.config(function ($routeProvider) {
    $routeProvider.when('/:lang/', {
        templateUrl: 'partials/posts.html', controller: 'PostsCtrl'})
    .when('/:lang/post/:id', {
        templateUrl: 'partials/post.html', controller: 'PostCtrl'})
    .otherwise({
        redirectTo: '/en'
    });
})

posts.html

<div ng-hide="loading">
    <a href="#/en/post/{{post.id}}" ng-repeat="post in posts " class="{{post.class}}">
        <div class="title">{{post.title}}</div>
        <div class="index">{{post.id}}</div>
    </a>
</div>

的index.html

<body ng-app="Posts">
    <div ng-show="loading">Loading ...</div>
    <div class="container" ng-view></div>
    <a href="#/fr" >FR</a> 
    <a href="#/en" >EN</a>
</body>

1 个答案:

答案 0 :(得分：0)

在您的帖子中。您是否尝试在$scope.$apply()的{{1}}下方添加$scope.posts = posts;，在posts.js的{{1}}下再次添加？{/ p>

您面临的问题可能是由于Angular的摘要周期以及您尝试通过promises / objects / wizardry传递值的奇怪方式。

我的意思是，这是你最不担心的事情。我对这个项目一无所知，但是有一些事情可能会引起一个问题。

为什么没有时间$scope.id = post.id;？
为什么要设置post.js var然后立即使用它而不是仅仅通过它？
为什么要分配工厂的帖子成员然后立即使用它而不是仅仅通过它？
您应该将$timeout()用于动态网址

告诉我们你是如何上场的。