Question

您好我正在尝试使用控制器和工厂将一些数据恢复到视图的简单示例，但出于某种原因我无法打印它。

我设法让ajax调用工作。如果我输入

$scope.sampleStyles = [{ sample: 'text here', text : 'dasdas'}

并且不使用可行的ajax调用

更新：如果我在分配到我的范围之前添加警报它是有效的（ajax有时间做他的事情）有谁知道如何克服这个问题？

CODE：

var packageApp = angular.module("packageApp", []);

packageApp.controller（＆＃34; MyController＆＃34;，function（$ scope，myFactory）{

$scope.sampleStyles = [];  

function init(){
    $scope.sampleStyles = myFactory.getSampleStyles();  
} 
init();

});

packageApp.factory('myFactory', function($http, $log){
var factory = {};

var sampleStyles = [];
var tempData = {};

factory.update = function(){
    $.ajax({
        type: 'POST',
        url: '/account/fetch-sample-styles',
        data: {
            source: 'ajax'
        },
        success: function(data, textStatus, XMLHttpRequest){
            tempData = data;   
        }
    });


    alert(tempData);    
    sampleStyles = tempData;
} 


factory.getSampleStyles = function(){ 
    factory.update();
    return sampleStyles;

};

return factory;
 });

Answer 1

您使用的是AngularJs $http服务吗？如果是这样，它将返回您随后操作的承诺。以下是AngularJs文档中promises的更多内容。

我的猜测是，您正在使用ajax.get（...）并在其中定义成功回调。问题可能是由于成功回调不属于＆＃34; AngularJs世界。＆＃34;

要解决此问题，您需要告诉AngularJs其范围已更改。使用$[Root]scope.$apply()函数，并将作用域作为依赖项注入服务中。

工厂里面有这样的东西：

$.ajax({
    url: "/api/some/end/:point", 
    ...
    success: function(data) {
        $scope.$apply(function() {
            $scope.sampleStyles = data; // etc
        });
    }
});

我强烈建议您查看$http服务，它使上面的代码更好，并且设计为与$ scope一起使用。

$http.get("/api/end/point").then(function(response) {
    // response.data points at the page data sent back, assuming that your
    // api endpoint sends back JSON of the likes of
    // { status: "SUCCESS", styles: [...] }
    $scope.sampleStyles = response.data.styles;
});

修改既然您发布了一些代码，那么您的问题的根源似乎是基于ajax get是异步调用的事实。为什么你甚至搞乱使用临时变量？为什么不以下？

factory.update = function(){ $.ajax({ type: 'POST', url: '/account/fetch-sample-styles', data: { source: 'ajax' }, success: function(data, textStatus, XMLHttpRequest){ sampleStyles = data; } }); }

如果你真的想让$ .ajax调用阻塞，你可以在$ .ajax属性中设置async: false。

编辑2： 修复了一些破碎的链接，对不起我是新手:(

角度js从laravel获取数据并打印它

1 个答案: