我正在使用Angular构建一个http请求，$http并尝试使用响应中的数据返回来更新位于'$ scope'的模型。当我从节点后端收到响应时，我正在设置'$ scope.data = data;'。在成功回调中。当我逐步浏览javascript时，可以看到响应正确，并且显示了状态码。以下是我要执行的操作的一个示例：
angular.module("Sample").controller('MainCtrl', ['$http', '$scope', function($http, $scope) {
this.testcall = function (url) {
$http.post(url).success(function (data, status) {
console.log(data);
$scope.data = data;
$scope.status = status;
console.log($scope.data);
}).error(function (data, status) {
console.log('failed');
$scope.response = 'failed call';
$scope.status = status;
});
};
}
在我的html模板中，我在div中设置了控制器，并且我试图显示该响应。
<div ng-controller="MainCtrl as main">
{{data}}
</div>
我可以为数据设置一个值，并使其在加载时显示，但是当值更改时，它不会被重绘。据我了解，“ $ http”会导致“ $ digest”被调用，这应该重新绘制任何修改过的模型。
我相信我最初的问题是$scope。我最终通过创建新指令来解决问题，以试图将范围和问题隔离开。
下面分别是我的button-directive.js和标记。
(function() {
var app = angular.module('Sample', []);
app.directive('submitButton', function() {
return {
restrict: 'E',
scope: {}
};
});
app.controller('SubmitCtrl', ['$http', '$scope',
function($http, $scope) {
this.submit = function() {
console.log('hit');
$http.get('http://ip.jsontest.com/').success(function(data, status) {
$scope.data = data;
$scope.status = status;
console.log(data);
}).error(function(data, status) {
$scope.status = status;
$scope.data = data;
});
};
}
]);
})();<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="Sample">
<div ng-controller="SubmitCtrl as controller">
<button type="submit" ng-click="controller.submit()">Submit</button>
Response Data: {{data}}
<br/>Status Code: {{status}}
</div>
</div>本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句