Angularjs 角组件不符合承诺和服务要求

我对调用服务的角度组件有一个非常奇怪的问题。 例如，我有一个简单的服务，里面有一些模拟数据作为数组。我添加了两个方法，一个是synchron，另一个是asynchron，如果我理解正确，它将返回一个承诺。 现在，我们有一个角度组件，它在示例应用程序中加载良好。 在前端我有两个按钮，一个用于服务中的每个方法。 如果我现在按下按钮btn1，列表加载良好，一切正常。 如果现在按下按钮btn2，我会在控制台中看到服务正确返回所有数据，但前端中的列表将不会加载

服务

控制器

组件HTML

我也尝试了这个服务调用，但它也返回了一个承诺对象

loadItems: function () {
    return this.$http.get(this.url).then(function (response) {
        return response.data;
    });
},

有人能帮我找到解决方案吗？

this.items=response

---

这在上下文中不再存在。尝试通过外部变量（如“this”）保存上下文，或者如果有可用的箭头函数，则使用箭头函数。

您有函数响应，但您希望数据包含某些内容。。。$http已经返回了一个承诺，所以使用$q是多余的，这是平等的。问题是，如果我使用synchron调用，前端只显示列表。顺便说一句，我会将标题重命名为如何伪造承诺&如何将承诺返回到组件控制器。因为组件确实与服务和承诺一起工作。我不想伪造承诺，我只想在页面本身中看到我的数据，而不仅仅是在控制台中！这是一个很好的建议，也是解决方案的一部分。与FountainJS相反，数据必须加载到$scope变量中，而不是加载到这个变量中。这可以通过={}arrow函数完成。

function Foo(ItemsService) {
    this.itemsService = ItemsService;
}

Foo.prototype = {
    loadItems: function () {
        this.items = this.itemsService.loadItems();
    },
    loadItemsAsync: function () {
        this.itemsService.loadItemsAsync().then(
            function (response) {
                this.items = response;
                console.log('data->' + this.items + ' -> ' + this.items[0].name);
            },
            function (error) {
                console.log('error->' + error); // ignore
            }
        );
    }
};

<section>
    <button id="btn1" ng-click="$ctrl.loadItems()">Load</button>
    <button id="btn2" ng-click="$ctrl.loadItemsAsync()">Load Async</button>
    <ul>
        <li ng-repeat="item in $ctrl.items">{{item.id}} // {{item.name}}</li>
    </ul>
</section>

loadTreasuriesAsync: function () {
    var $qme = this.$q;
    return this.$http.get(this.url).then(
        function (response) {
            return $qme.resolve(response.data);
        },
        function (error) {
            throw error;
        }
    );
}

loadItems: function () {
    return this.$http.get(this.url).then(function (response) {
        return response.data;
    });
},