3

首先，如果我会感到困惑，我很抱歉，但我整个晚上都在解决这个问题，而且我已经阅读了几十个 SO 问题和 AngularJS 文章，所以我现在什至不确定我是否知道问题出在哪里:)

我有一个 ng-app，当我在控制器中为 的几个属性定义默认数据时$scope，当此数据稍后以编程方式更改时，视图将停止更新。

这是我的代码的一个简短示例：

...
config(['$routeProvider', function($routeProvider) {
$routeProvider.
    when('/abc/:letter', {templateUrl: template, controller: FilterCtrl}).
    otherwise({redirectTo: '/abc/a'});
}])
...

控制器：

function FilterCtrl($scope, $http, $routeParams) {

    $scope.mainfilter = $routeParams.letter;
    $scope.listItems = $http.post($scope.url, {'filterType': 'abc', 'letter': $routeParams.letter});

    $scope.searchTitle = function(search) {
        $scope.mainfilter = 'Film: ';
        //just test code to see if the data changes, will be other http call actually
        $scope.listItems = $http.post($scope.url, {'filterType': 'abc', 'letter': 'n'});
    }
}

定义视图的主要标记（Symfony2，请忽略树枝逻辑）：

    ...
    <div class="sort cell-1022 transparent-gray-back overflow-fix">

        <span class="sort--title">Search by</span>

        <select class="sort--selected chzn-select" ng-model="searchtitle" ng-change="searchTitle(searchtitle)">
            <option value="">film title</option>
            {% for id,title in titles %}
                <option value="{{ id }}">{{ title }}</option>
            {% endfor %}
        </select>

    </div>

</div>

<div class="divider transparent"></div>

<article class="wrapper">
    <div class="transparent-gray-back" ng-view>


    </div>

</article>

模板的关键部分：

<div class="scroll-list nice-scrollbars" >

    <span class="heading">{{ mainfilter.toUpperCase() }}</span>
    <ul class="item-list">
        <li ng-repeat="item in listItems.data | orderBy:order | filter:filter">
            <a ng-click="getRelated(item._id)">{{ item.title }}</a>
        </li>
    </ul>

</div>

主要问题是，当我在那里有前 2 行控制器时，数据根据路由参数正确初始化，但在执行后searchTitle()它没有更新。当我删除前两行时，路由定义的数据不会被拉出（显然），但该searchTitle()方法正确地填充了mainfilter字段和重复<li>的 s。 我很绝望，我建议范围有问题，但目前我的信息超载，非常感谢你的帮助，所以！

4

2 回答 2

1

将控制器的初始“状态”/默认值包装成一个函数，并在$viewContentLoaded事件帮助时调用它。这是我的修复：

$scope.$on('$viewContentLoaded', $scope.init);

$scope.init = function() {
    $scope.mainfilter = $routeParams.letter;
    $scope.listItems = $http.post($scope.url, {'filterType': 'abc', 'letter': $routeParams.letter});
}

我仍然不知道为什么如果仅通过在控制器代码中分配值来设置默认数据会导致视图“卡”在该数据上，所以我愿意重新接受更好的答案，解释这个巫毒.

于 2012-12-29T21:46:42.847 回答
0

你可以试试下面的吗？

更改您使用 $http.post 的方式（在两个地方）。尝试像这样使用它：

$http.post($scope.url, {'filterType': 'abc', 'letter': $routeParams.letter}).success(function(data) {
   $scope.listItems = data;
});

这意味着您的 ng-repeat 略有变化：

ng-repeat="item in listItems"
于 2012-12-28T21:29:29.590 回答