为什么我的控制器中的数组更改没有反映在我的视图中?

Why are changes in my arrays in my controller not being reflected in my view?

这是我上一个问题的分支:

我将 TypeScript 与 Angular

结合使用

问题:我认为有一个 ng-repeat

    <!-- Simple View -->
<div ng-hide="wordTrack.showDetailedView">
    <div class="col-md-12" id="wordTrackResult" style="padding: 10px; overflow-y: auto; overflow-x: hidden;">

        <div class="wordListWellWrapper row" ng-repeat="words in wordTrack.wordList">
            <div class="col-md-5 wordListWell form-control" ng-class="(words.IsPositive)? 'posWordWell': 'negWordWell' ">
                <strong class="wordListWord">{{words.Word}}</strong>
                <div class="wordListIcon">
                    <div class="whiteFaceIcon" ng-class="(words.IsPositive)? 'happyWhiteIcon': 'sadWhiteIcon' "></div>
                </div>
            </div>
            <div class="col-md-2">
                <span aria-hidden="true" class="glyphicon-remove glyphicon" ng-click="wordTrack.removeWord(words.Word)"></span>
            </div>
        </div>

        <p class="noWordText" ng-show="(wordTrack.notUsedWordList.length > 0)">The following words have not yet been used</p>

        <div class="wordListWellWrapper row" ng-repeat="words in wordTrack.notUsedWordList">
            <div class="col-md-5 wordListWell form-control" style="background-color: gray;">
                <strong class="wordListWord">{{words}}</strong>
            </div>
            <div class="col-md-2">
                <span aria-hidden="true" class=" glyphicon-remove glyphicon" ng-click="wordTrack.removeWord(words)"></span>
            </div>
        </div>

    </div>
</div>

在我的控制器中使用了两个数组(wordList 和 notUsedWordList):

 module WordsToTrackController {
export class Controller {
    public static $inject = ["$scope", "CampaignFactory", "VideoFactory", "DashboardFactory", "WordsToTrackFactory"];
    wordList: Array<IWordTrackItem>;
    notUsedWordList: Array<string>;


    constructor($scope: ng.IScope, campaignFactory, videoFactory, dashboardFactory, wordsToTrackFactory) {
        this.campaignFactory = campaignFactory;
        this.videoFactory = videoFactory;
        this.dashboardFactory = dashboardFactory;
        this.wordsToTrackFactory = wordsToTrackFactory;

        this.wordList = [];
        this.notUsedWordList = [];

        this.hasData = false;
        this.fetchInProgress = false;

        $scope.$on("video-switch",() => {
            this.setWordLists();
        });

        $scope.$on("detail-switch",() => {
            this.showDetailedView = this.dashboardFactory.isDetailedView;
        });
    }}}

在我的构造函数中,我正在调用

        $scope.$on("video-switch",() => {
            this.setWordLists();
        });

执行 setWordLists() 尝试从我的工厂之一获取数据并设置数组的值(它正在正确执行)

控制器:

   setWordLists() {
        this.fetchInProgress = true;
        var campaignId = this.campaignFactory.currentId();
        var videoId = this.videoFactory.currentId();

        if (!campaignId || !videoId) {
            return;
        }

        this.wordsToTrackFactory.doGetWordsToTrackModel(campaignId, videoId)
            .then((response) => {
            this.fetchInProgress = false;
            this.wordList = (response) ? response.data.WordList : [];
            this.notUsedWordList = (response) ? response.data.NotUsedWords : [];
        });
    }

工厂:

    function doGetWordsToTrackModel(campaignId: number, videoId: number) {
        return $http
            .get(url, {
            params: {
                videoId: videoId,
                campaignId: campaignId
            }
        });
    }

现在的问题是,即使数组被设置为正确的值,它在我看来(在 ng-repeat 内)也没有更新。

我也不想调用 $scope.$apply() 进行快速修复。谁能找出问题的根源?

编辑: $scope.$apply() 没有帮助,所以我认为 ng-repeat 没有正确绑定,但我看不出我是如何错误地设置视图的。

编辑:.......

我是个白痴,把我的“ng-controller="Controller as controller"”放在了错误的元素上……

错误代码:

                            <div class="col-md-4" >
                        <h2 class="text-center" ng-controller="WordsToTrackController as wordTrack">Words to Track</h2>

更正代码:

                            <div class="col-md-4" ng-controller="WordsToTrackController as wordTrack">
                        <h2 class="text-center">Words to Track</h2>