我正在AngularJS的这个网站上工作。我遇到一个问题,当我点击导航链接(带有href的标签)时,网址正在改变,但页面内容没有得到更新。因此,如果我点击“关于”链接,则会将网址修改为#/ about,而不是内容。但是,如果我现在手动刷新页面,则会加载内容。
请访问网站:www.arunmahendrakar.com/nsm /
链接在Angular之外,我不知道在哪里需要添加$ apply函数,如果有的话。
nsm.controller.js具有路由和控制器详细信息,nsm.services.js有一个服务从服务器获取数据,而nsm.directives.js用于突出显示当前链接。
index.html页面使用bootstrap 3.0。
请告诉我如何解决此问题。
答案 0 :(得分:0)
导航时页面上有一个闪烁,因此angular会注意到更改并尝试更新页面。
问题看起来像你的directives.js,它在$ location.path()
上添加了一个监听器scope.$watch('location.path()', function (newPath) {...});
根据讨论here,您想要使用
$scope.$watch(function() {return location.path()}, function(path) {...});
对$ location.path()的调用可能会干扰路由。
修改强>
以下可能会解释它:
services.factory('pageData', ['$resource', '$route',
function ($resource, $route) {
// this is done so I can run the e2e tests from the :8000 port
//debugger;
var slug = ($route.current.params.slug || 'home') + '.txt';
return $resource('http://arunmahendrakar.com/nsm/data/:slug', { slug: slug });
}]);
services.factory('pageDataLoader', ['pageData', '$q',
function (pageData, $q) {
return function () {
var delay = $q.defer();
pageData.query(function (pData) {
delay.resolve(pData);
}, function () {
delay.reject('Unable to fetch data');
});
return delay.promise;
};
}]);
pageData工厂返回$ resource对象。当页面加载时,仅调用一次。 pageDataLoader工厂返回一个函数。每次实例化pageDataLoader时都会调用此函数。