我正在尝试构建一个简单的角度应用程序,它可以从Instagram获取数据。用户在索引页上输入一个hashtag,然后显示到另一个页面,其中显示带有该hashtag的帖子。
我尝试传递作为服务中的变量使用的哈希标记,但是当视图被更改时,值将被覆盖。(我可以在设置该值之后立即检查它,但一旦页面更改,我就会丢失该值)。
这是我的服务:
var instagramApp = angular.module('instagramApp')
.factory('feedData', function($rootScope) {
var config = {};
return {
setHashtag: function (x) {
config.hashtag = x;
},
getHashtag: function () {
return config.hashtag;
}
}
});
我的两个控制员:
设置hashtag ( /index.html视图):
instagramApp.controller('indexController', ['$scope', 'feedData', '$window',
function($scope, feedData, $window){
$scope.generate = function(){
feedData.setHashtag('marcheet');
console.log(feedData.getHashtag());
$window.location.href = '/results.html';
};
}]);
获取hashtag ( /results.html视图):
instagramApp.controller('instagramController', ['$scope', 'Instagram', '$http', 'feedData',
function($scope, Instagram, $http, feedData){
feedUrl = '/feed/?hashtag=' + feedData.getHashtag() +'&count=20';
console.log(feedUrl);
createStoryJS({
type: 'timeline',
width: '800',
height: '600',
source: feedUrl,
embed_id: 'my-timeline'
});
}
]);
发布于 2015-05-05 20:08:16
正如@pcguru所提到的,当您运行这一行$window.location.href = '/results.html';
时,您的角度应用程序将被浏览器重新加载。
当用户单击页面上的链接或通过设置$location.path('/someurl');
(这是获取/设置url信息的角服务)时,Angular会检测url中的变化。你的javascript绕过了。
$location不做什么? 当浏览器URL被更改时,它不会导致整个页面重新加载。若要在更改URL后重新加载页面,请使用低级API $window.location.href。
如果您想以编程方式更改url,请使用$location.path(url)
,如果您希望用户单击一个链接并在不需要浏览器重新加载页面的情况下转到应用程序中的一个新位置,则需要使用angular-route.js
(https://code.angularjs.org/1.3.15/angular-route.js)设置路由,然后将$routeProvider
注入应用程序的配置方法中。
(function() {
'use strict';
var app = angular.module('instagramApp', ['ngRoute']);
app.config(configFunc);
function configFunc($routeProvider) {
$routeProvider.when('/', {
templateUrl: 'path/to/your/template.html',
controller: 'HomeController'
})
.when('/results', {
templateUrl: 'path/to/your/template.html',
controller: 'ResultsController'
});
}
}());
发布于 2015-05-05 19:35:12
您需要使用角的路由器来处理位置变化。这样,当您转到详细信息视图时,您将不会从头开始重新加载整个应用程序。
https://stackoverflow.com/questions/30061562
复制相似问题