为什么我在我的控制器阵列的变化没有反映在我的看法？ [英] Why are changes in my arrays in my controller not being reflected in my view?

查看：117 发布时间：2016/5/9 21:24:06 angularjs typescript angularjs-ng-repeat

本文介绍了为什么我在我的控制器阵列的变化没有反映在我的看法？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

这是妖异我的最后一个问题：<一href=\"http://stackoverflow.com/questions/28012633/how-to-call-scope-apply-using-controller-as-syntax?noredirect=1#comment44412979_28012633\">How使用控制器来称呼$范围。适用于$（）语法

我使用的打字稿与角结合

问题：我有一个NG重复在我看来

 ＆LT;！ - 简单查看 - ＆GT;
＆LT; DIV NG隐藏=wordTrack.showDetailedView＆GT;
    ＆LT; DIV CLASS =COL-MD-12ID =wordTrackResult的风格=填充：10px的;溢出-Y：汽车;溢出-X：隐藏;＆GT;        ＆LT; DIV CLASS =wordListWellWrapper行NG重复=，在wordTrack.wordList词＆GT;
            ＆LT; DIV CLASS =COL-MD-5 wordListWell形式控制NG-CLASS =（words.IsPositive）'posWordWell'：'negWordWell'＆GT;
                ＆LT;强类=wordListWord＆GT; {{words.Word}}＆LT; / STRONG＆GT;
                ＆LT; DIV CLASS =wordListIcon＆GT;
                    ＆LT; DIV CLASS =whiteFaceIcon纳克级=（words.IsPositive）'happyWhiteIcon'：'sadWhiteIcon'＆GT;＆LT; / DIV＆GT;
                ＆LT; / DIV＆GT;
            ＆LT; / DIV＆GT;
            ＆LT; DIV CLASS =COL-MD-2＆GT;
                ＆LT;跨度ARIA隐藏=真级=glyphicon-删除glyphiconNG点击=wordTrack.removeWord（words.Word）＆GT;＆LT; / SPAN＆GT;
            ＆LT; / DIV＆GT;
        ＆LT; / DIV＆GT;        ＆下，P类=noWordText纳克秀=（wordTrack.notUsedWordList.length大于0）＆gt;将下列词语尚未使用的，所述; / P＆GT;        ＆LT; DIV CLASS =wordListWellWrapper行NG重复=，在wordTrack.notUsedWordList词＆GT;
            ＆LT; DIV CLASS =COL-MD-5 wordListWell形式控制的风格=背景色：灰;＆GT;
                ＆LT;强类=wordListWord＆GT; {{}话}＆LT; / STRONG＆GT;
            ＆LT; / DIV＆GT;
            ＆LT; DIV CLASS =COL-MD-2＆GT;
                ＆LT;跨度ARIA隐藏=真级=glyphicon-删除glyphiconNG点击=wordTrack.removeWord（字）＆GT;＆LT; / SPAN＆GT;
            ＆LT; / DIV＆GT;
        ＆LT; / DIV＆GT;    ＆LT; / DIV＆GT;
＆LT; / DIV＆GT;

：这是在我的控制器（单词表和notUsedWordList）使用两个数组

 模块WordsToTrackController {
出口类控制器{
    公共静态$注射=$范围，CampaignFactory，VideoFactory，DashboardFactory，WordsToTrackFactory];
    单词表：数组＆LT; IWordTrackItem取代;
    notUsedWordList：数组＆LT;字符串取代;
    构造函数（$范围：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;        $范围$（视频开关上，（）=方式＆gt; {
            this.setWordLists（）;
        }）;        $范围$（细节开关上，（）=方式＆gt; {
            this.showDetailedView = this.dashboardFactory.isDetailedView;
        }）;
    }}}

在我的构造，我打电话

  $范围$（视频开关上，（）=方式＆gt; {
            this.setWordLists（）;
        }）;

其执行它试图抓住从我的工厂之一的数据，并设置数组的值（它是做正确）setWordLists（）

控制器：

  setWordLists（）{
        this.fetchInProgress = TRUE;
        VAR CAMPAIGNID = this.campaignFactory.currentId（）;
        VAR VIDEOID = this.videoFactory.currentId（）;        如果（！CAMPAIGNID ||！VIDEOID）{
            返回;
        }        this.wordsToTrackFactory.doGetWordsToTrackModel（CAMPAIGNID，VIDEOID）
            。然后（（响应）=＆GT; {
            this.fetchInProgress = FALSE;
            this.wordList =（响应）？ response.data.WordList：[];
            this.notUsedWordList =（响应）？ response.data.NotUsedWords：[];
        }）;
    }

厂址：

 函数doGetWordsToTrackModel（CAMPAIGNID：编号，VIDEOID：号码）{
        返回$ HTTP
            获得（网址：{
            params：一个{
                VIDEOID：VIDEOID，
                CAMPAIGNID：CAMPAIGNID
            }
        }）;
    }

现在的问题是，即使阵列被设置为正确的价值观，它不被在我看来更新（吴重复内）。

我不想调用$范围。$申请（）速战速决无论是。任何人都可以当场问题的根源？

编辑：
$范围。$适用（）没有帮助，所以我想NG重复没有正确绑定，但我不能看我怎么设置视图不正确。

编辑：........

解决方案

我是个白痴，把我的'NG控制器=控制器作为控制器'不正确的元素.......

错误code：

 ＆LT; DIV CLASS =COL-MD-4＆GT;
                        ＆LT; H2类=TEXT-中心NG控制器=WordsToTrackController为wordTrack＆GT;话说到轨道＆LT; / H＆GT;

修正code：

 ＆LT; DIV CLASS =COL-MD-4NG控制器=WordsToTrackController为wordTrack＆GT;
                        ＆LT; H2类=TEXT-中心＆GT;话说到轨道＆LT; / H＆GT;

This is branching off of my last question: How to call $scope.$apply() using "controller as" syntax

I am using TypeScript in conjunction with Angular

Problem: I have an ng-repeat in my view

    <!-- 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>

which is using two arrays in my controller (wordList and 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;
        });
    }}}

Inside my constructor, I am calling

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

which executes setWordLists() which attempts to grab the data from one of my factories and set the values of the arrays (which it is doing correctly)

Controller:

   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 : [];
        });
    }

Factory:

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

Now, the problem is that even though the arrays are being set to the correct values, it is not being updated in my view (inside the ng-repeat).

I don't want to call $scope.$apply() for a quick fix either. Can anyone spot the source of the problem?

Edit: $scope.$apply() doesn't help, so i'm thinking ng-repeat isn't binding correctly, but I can't see how I set the view up incorrectly.

Edit: ........

解决方案

I'm a moron and put my ' ng-controller="Controller as controller" ' on the incorrect element.......

wrong code:

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

corrected code:

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

这篇关于为什么我在我的控制器阵列的变化没有反映在我的看法？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文

为什么我在我的控制器阵列的变化没有反映在我的看法？ [英] Why are changes in my arrays in my controller not being reflected in my view?

问题描述

相关文章

JavaScript最新文章

热门教程

热门工具

登录关闭

为什么我在我的控制器阵列的变化没有反映在我的看法？ [英] Why are changes in my arrays in my controller not being reflected in my view?

问题描述

相关文章

JavaScript最新文章

热门教程

热门工具

登录 关闭

登录关闭