gpt4 book ai didi

javascript - AngularJS:如何在通过 $http 获取数据时禁用默认观察者

转载 作者:塔克拉玛干 更新时间:2023-11-01 21:23:50 24 4
gpt4 key购买 nike

我正在使用 $http.get 获取身份验证和用户详细信息,以便我可以显示用户名而不是登录按钮。

.directive("plunkerUserPane", ["collectionsManager", function(collectionsManager) {

var getAuth = function($http) {
$http.get('/user/auth').success(function(response) {
if (response.isAuth) {
return 'user.html';
} else {
return 'userPane.html';
}
});
};

return {
restrict: "E",
replace: true,
template: '<div ng-include src="userPane.getTemplate()"></div>',
controllerAs: "userPane",
controller: ["$scope", "$http", "login", "visitor", function($scope, $http, login, visitor) {
this.visitor = visitor;
this.getTemplate = function() {
var template = 'userPane.html';
template = getAuth($http);
return '/components/userPane/' + template;
}
this.showLoginWindow = function() {
login.open();
};
}]
};
}])

每当 get 请求接收到数据时,默认观察者会再次调用它,并开始无限循环。如何禁用它们或以任何其他方式解决此问题。

最佳答案

scope 方法上调用 API 不是一个理想的解决方案,因为它们会因为 $digest 循环而被多次评估。您可以为此使用 callbackspromises,并且可以删除 method 以从模板发出 http 请求。

见下文

回调

.directive("plunkerUserPane", ["collectionsManager", function(collectionsManager) {

var getAuth = function($http, cb) {
$http.get('/user/auth').success(function(response) {
if (response.isAuth) {
cb('user.html');
} else {
cb('userPane.html');
}
});
};

return {
restrict: "E",
replace: true,
template: '<div ng-include src="userPane.template"></div>',
controllerAs: "userPane",
controller: ["$scope", "$http", "login", "visitor", function($scope, $http, login, visitor) {
var self = this;
self.visitor = visitor;
self.template = 'userPane.html';
self.showLoginWindow = function() {
login.open();
};
getAuth($http, function(template) {
self.template = '/components/userPane/' + template;
});
}]
};
}])

promise

.directive("plunkerUserPane", ["collectionsManager", function(collectionsManager) {

var getAuth = function($http, cb) {
return $http.get('/user/auth').then(function(response) {
if (response.isAuth) {
return 'user.html';
} else {
return 'userPane.html';
}
});
};

return {
restrict: "E",
replace: true,
template: '<div ng-include src="userPane.template"></div>',
controllerAs: "userPane",
controller: ["$scope", "$http", "login", "visitor", function($scope, $http, login, visitor) {
var self = this;
self.visitor = visitor;
self.template = 'userPane.html';
self.showLoginWindow = function() {
login.open();
};
getAuth($http).then(function(template) {
self.template = '/components/userPane/' + template;
});
}]
};
}])

请注意上述方案中Promise Chain的使用

关于javascript - AngularJS:如何在通过 $http 获取数据时禁用默认观察者,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47868970/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com