Question

$ scope.feeds在控制器内正在更新。但是视图不会更新变量。 feeds变量位于ng-repeat中。

角度代码：

$scope.openfeeds = function(category){
    $http({
        method: 'GET',
        url:  '/category/feeds/'+category.id
    }).then(function successCallback(response) {
         $scope.feeds = response.data;
         console.log($scope.feeds);
    });
};

HTML代码：

<div class="c-Subscribe">
        <div class="c-Subscribe_feeds" ng-repeat="feed in feeds" ng-controller="LinkController">
            @{{feed}}
        </div>
    </div>

在此之上还有另一个名为category的变量。它以与更新Feed相同的方式进行更新。

<div class="c-modal_content">
        <div class="c-categoryTile_blocks">
            <div class="c-categoryTile" ng-repeat="category in categories">
                <div class="c-categoryTile_background" style="background-image: url('/images/biker-circuit-competition-63249.jpg');">
                    <a href="" ng-controller="LinkController" ng-click="openfeeds(category)">@{{ category.category }}</a>
                </div>
            </div>
        </div>
    </div>

有什么想法为什么不起作用？

Answer 1

我对这个问题How to preserve scope data when changing states with ui-router?的回答几乎相同

您需要了解原型继承的工作方式。当父母使用

将属性值放在作用域上时

$scope.value = 'something';

在子组件中，如果您访问$ scope.value，则继承链将找到$ scope.value。

如果孩子设置了

$scope.otherValue = 'something';

如果遵循继承链，则不会找到otherValue的值并在子作用域上创建属性，而不是在继承的原型上创建属性，因此父组件和父级的任何其他子项都看不到它。

您可以使用所谓的原型继承的点规则。如果父级在作用域上创建了一个称为数据的对象

$scope.data = { value: 'something' };

现在，如果孩子将属性放在数据对象上

$scope.data.otherValue = 'something';

它会查找数据对象，并在继承链中找到它，并且因为您正在向对象的实例添加属性，因此它对父级和父级的任何子级都是可见的。

let parent = {
  value: 'some value',
  data: { value: 'some value' }
};

let child = Object.create(parent);

console.log(child.value); // Finds value on the prototype chain

child.newValue = 'new value'; // Does not affect the parent

console.log(parent.newValue);

child.data.newValue = 'new value'; // newValue is visible to the parent

console.log(parent.data.newValue);

简短的答案是永远不要注入$ scope并使用controllerAs语法。

要在控制器之间共享数据，请使用注入到两个控制器中的服务。您在服务上具有了Spots集合，并使用路由参数来确定另一个控制器应使用哪个地点，或在另一个控制器上设置的名为currentSpot的服务上具有位置。

服务是您在模块级别创建的单例对象，然后在其依赖项列表中要求它们的所有控制器都将获得相同的实例。它们是在控制器之间共享数据的首选方式，$ scope层次结构势必会引起混乱，因为它们的原型继承性质可能会造成混淆。子级$ scope原型是从其父级继承的，这似乎应该共享数据，但是当子级控制器设置属性时，父级不可见。

您正在学习一种过时的Angular编程方式。不再推荐使用$ scope注入。查看使用组件。组件是具有隔离范围并使用contollerAs语法的控制器的包装。孤立的作用域使人们更清楚地知道数据的来源。

看看我对这个问题的回答

Trying to activate a checkbox from a controller that lives in another controller

$ scope.feeds正在更新，但视图不会更新视图

1 个答案: