Angular - 我的控制器不会在视图中更新我的组件数据

Question

所以，我的问题是这样的：

我有一个使用过两次的组件，它定义了一个模板。

组件：

.component('topList', {
    template: '<div class="well"> \
                <div class="title"> \
                <h3>{{$ctrl.model.title}}</h3><a href="#" class="close"><i class="ss-delete"></i></a> \
                </div> \
                <div ng-repeat="i in $ctrl.model.items" class="list-question"> \
                <div class="item"><span class="number">{{$index + 1}}</span> \
                <div class="description"> \
                <h4>{{(i.Count/ $ctrl.model.total)*100 | number:2}}% ({{i.Count}} de {{ $ctrl.model.total }})</h4> \
                <p>{{i.Description}}</p> \
                </div> \
                </div> \
                </div> \
                </div>',
    controller: TopListController,
    bindings: {
        model: '='
    }
})

function TopListController() {

}

控制器：

    .controller('myController', function ($http, $scope, $controller, datesService) {
    var ctrl = this;

    $scope.api = function () {
            var date = datesService.getDates();
            $http.get("apicall/date.from/date.to").then(function (response) {
                ctrl.model = {
                    title: 'Title',
                    items: response.data.Items,
                    total: response.data.Total
                };
            });
    }

    $http.get("apicall/date1/date2").then(function (response) {
        ctrl.model = {
            title: 'Title',
            items: response.data.Items,
            total: response.data.Total
        };
    });
})

HTML（实际上是翡翠）：

    div(ng-controller="myController as controller")
        top-list(model="controller.model")

当页面加载时，组件填充了来自在创建控制器时调用的方法 $http.get 的数据，但是当我从 html 调用方法 api() 时，数据不会改变。

我正在从另一个控制器调用方法 api()。

Answer 1

1. 如果您使用获取的数据来更新视图，则无需调用$scope.$apply();。您已经使用 2 路数据绑定设置了观察者

2. 这个

   $http.get("apicall/date.from/date.to)
   

   应该是这个（你忘了"）

   $http.get("apicall/date.from/date.to")