如何在成功 ajax 请求后正确设置 $scope var？

Question

我正在使用 symfony 以及 AngularJs 1.6.8 和 Symfony 3.4。我有下一个配置：

base.html.twig

<html lang="en" data-ng-app="CeocApp" ng-controller="CeocController">
//css for the app
<link id="ng_load_plugins_before"/>
//more ccs for the app
<body>
....
<div class="row" ui-view></div>
....
<script src="{{ asset('assets/angular/angular/angular.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('assets/angular/angular-sanitize/angular-sanitize.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('assets/angular/angular-touch/angular-touch.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('assets/angular/angular-ui-router/release/angular-ui-router.min.js') }}"
        type="text/javascript"></script>
<script src="{{ asset('assets/angular/oclazyload/dist/ocLazyLoad.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('assets/angular/angular-ui-bootstrap/dist/ui-bootstrap-tpls.js') }}"
        type="text/javascript"></script>

<script src="{{ asset('assets/ceoc/angular_app/ceoc-angular-app.js') }}"></script>
</body>
</html>

ceoc-app.js

var CeocApp = angular.module('CeocApp', [
    'ui.router',
    "ui.bootstrap",
    "oc.lazyLoad",
    "ngSanitize"
]).config(['$interpolateProvider', function ($interpolateProvider) {
    $interpolateProvider.startSymbol('{[{').endSymbol('}]}');
}]);

CeocApp.config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.otherwise("/dashboard");

    $stateProvider
        .state('dashboard', {
            url: "/dashboard",
            templateUrl: "../templates/dashboard.html",
            controller: "DashboardController as dashboard",
            resolve: {
                deps: ['$ocLazyLoad', function ($ocLazyLoad) {
                    return $ocLazyLoad.load({
                        name: 'CeocApp',
                        insertBefore: '#ng_load_plugins_before', 
                        files: [
                            '../assets/ceoc/angular_app/controllers/dashboard-controller.js'
                        ]
                    });
                }]
            }
        })

}]);

dashboard-controller.js 是一个可以工作但存在问题的控制器：

问题 1:$http.get(Rountin.generate('route_name')) 不起作用。

当我运行应用程序加载控制器时，在 $http.get() 请求之前的所有内容都有效，但之后的代码没有 ()

angular.module('CeocApp').controller('DashboardController', ['$scope', '$rootScope', function ($scope, $rootScope, $http) {
    $rootScope.pageTitle = 'Dashboard';
    $scope.total = 2500;
    alert('this line will be reached');
    $http.get(Routing.generate('ceoc.dashboard')).then(function (data) {
        $scope.total = 10000 
    }, function (data) {
    });
    alert('this line will never be reached');
}]);

问题 2： $.get 不允许我更改 $scope 值。

当我将 $http.get() 更改为 $.get() 时，它起作用并且发出了 ajax 请求，但未修改 $scope.total 值。

angular.module('CeocApp').controller('DashboardController', ['$scope', '$rootScope', function ($scope, $rootScope, $http) {
    $rootScope.pageTitle = 'Dashboard';
    $scope.total = 2500;

    $.get(Routing.generate('ceoc.dashboard')).success(function (data) {
        alert('request successfull');
        $scope.total = 200; //this value won't be setted
    }).then(function () {
        $scope.total = 6000;
    });

$scope.total = '879';//this value will be setted
}]);

The server response

{"retrasadas":5,"total":10,"en_tiempo":5}

我的问题是如何在 ajax 请求成功后正确设置 $scope.anyvar 值？（使用 $ 或 $http）我错过了什么吗？

提前致谢

Answer 1

使用Coec的handleAjax函数及其回调参数：

Ceoc.handleAjax(Routing.generate('ceoc.dashboard'), "GET", function (data) {
  $scope.total = data.total;
  $scope.$apply();
});

如何在成功 ajax 请求后正确设置 $scope var？

how to properly set a $scope var after successfull ajax request?

javascript

ajax

symfony

angularjs

symfony-3.4