AngularJS，jQueryAjax请求，总是需要请求（单击）两次_Jquery_Ajax_Angularjs_Controller

AngularJS，jQueryAjax请求，总是需要请求（单击）两次

jquery ajax angularjs

AngularJS，jQueryAjax请求，总是需要请求（单击）两次,jquery,ajax,angularjs,controller,Jquery,Ajax,Angularjs,Controller,我已经准备好了试着搜索anwser。。。我卡住了我尝试在控制器之间进行通信这对我来说很好在下一步中，我尝试添加一个ajax请求，该请求的结果应该发送给控制器请求正在完成他的工作，但不幸的是，只有在每一秒的请求中 AJAX请求这是怎么回事 JAVASCRIPT HTML 谢谢。问题是您的代码在AngularJS世界之外执行。确切地说，任何应该触发双向数据绑定的外部事件都应该触发AngularJS$digest循环。请参阅以了解更多关于此的信息现在，回到您的特定问题，您有两种解决方案：

我已经准备好了试着搜索anwser。。。我卡住了

我尝试在控制器之间进行通信

这对我来说很好

在下一步中，我尝试添加一个ajax请求，该请求的结果应该发送给控制器

请求正在完成他的工作，但不幸的是，只有在每一秒的请求中

AJAX请求

这是怎么回事

JAVASCRIPT

HTML

谢谢。

问题是您的代码在AngularJS世界之外执行。确切地说，任何应该触发双向数据绑定的外部事件都应该触发AngularJS$digest循环。请参阅以了解更多关于此的信息

现在，回到您的特定问题，您有两种解决方案：

放弃jQueryAjax，转而使用AngularJS$http服务。这是一个首选解决方案，它更简单、更好：

将调用包装在$scope中。$apply方法在jQuery调用完成时触发$digest循环

但实际上，让jQuery走吧……

为什么要将jQuery用于AJAX请求。Angular有$http服务，其功能与Angular完全相同，并且与Angular的其余部分集成良好。

var request = $.post("http://www.mydomain.com/search.php", { data: "" });
    request.done(function( data ) {
        sharedService.prepForBroadcast(data);
    });
};

var myModule = angular.module('myModule', []);
myModule.factory('mySharedService', function($rootScope) {

    var sharedService = {};
    sharedService.message = '';

    sharedService.prepForBroadcast = function(msg) {
        this.message = msg;
        this.broadcastItem();
    };

    sharedService.broadcastItem = function() {
        $rootScope.$broadcast('handleBroadcast');
    };

    return sharedService;
});

function Controller($scope, sharedService) {

    $scope.handleClick = function() {

        var request = $.post("http://www.mydomain.com/search.php", { data: "" });
        request.done(function( data ) {
            sharedService.prepForBroadcast(data);
        });
    };

    $scope.$on('handleBroadcast', function() {
        $scope.message = 'zero: ' + sharedService.message;
    });
}

function ControllerOne($scope, sharedService) {
    $scope.$on('handleBroadcast', function() {
        $scope.message = 'ONE: ' + sharedService.message;
    });        
}

function ControllerTwo($scope, sharedService) {
    $scope.$on('handleBroadcast', function() {
        $scope.message = 'TWO: ' + sharedService.message;
    });
}

Controller.$inject = ['$scope', 'mySharedService'];        
ControllerOne.$inject = ['$scope', 'mySharedService'];
ControllerTwo.$inject = ['$scope', 'mySharedService'];

<script type='text/javascript' src="http://code.angularjs.org/angular-1.0.0rc9.js"></script>
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>

<body ng-app="myModule">

    <div ng-controller="Controller">
        <button ng-click="handleClick();">read json</button>
    </div>

    <div ng-controller="ControllerOne">
        <input ng-model="message" >
    </div>

    <div ng-controller="ControllerTwo">
        <input ng-model="message" >
    </div>