angularjs：范围值不会在视图中更新答案

【问题标题】：angularjs: scope value doesn't get updated in viewangularjs：范围值不会在视图中更新
【发布时间】：2015-02-08 23:58:44
【问题描述】：

detail.html 文件中有按钮：

<div ng-controller="test.views.detail">
<div data-ng-repeat="item in details"  scroll>
    <button ng-click="showDetails(item)">The details</button>

详细.js文件

angular.module('test')
.controller('test.views.detail', function($scope) {

    $scope.detailsClicked = false;

    $scope.showDetails = function(item){
        $scope.detailsClicked = true;
    }....

在formDetail.html代码中：

<div ng-controller="test.views.detail">
{{detailsClicked}}
<div ng-if="detailsClicked">...

最初它显示false for detailsClicked，当我点击按钮时，它转到 showDetails 函数但$scope.detailsClicked 的值永远不会更新！直截了当不知道为什么它不起作用:(

【问题讨论】：

我认为这是因为 ng-repeat 引入了一个额外的范围。
如果你使用 ControllerAs 语法，你应该可以摆脱它，但老实说，我有一段时间没有做过 Angular，所以有点生疏（但我仍然记得这一点...）。我认为 ControllerAs 将允许您专门引用控制器 detailsClicked 属性，因此 Angular 将知道该怎么做（我认为）=P.
formDetail.html 是如何发挥作用的？
您是否尝试将$scope.detailsClicked 移动到$scope.obj = { detailsClicked: false};？在早期版本的 Angular 中，“始终在绑定中有一个点”是最佳实践。
test.views.detail 控制器有两个实例——一个在 formDetail.html 中，另一个在 detail.html 中。如果您想在两个实例之间共享状态，请创建一个服务来保存状态或使用状态参数（如果您使用的是 ui-router）。

标签： angularjs angularjs-scope angular-ng-if

【解决方案1】：

这是因为您在两个地方使用了相同的控制器，并且期望范围对象与实际不同。每次您在标记中调用 ng-controller 时，都会创建一个新的范围对象。如果您希望它们基于相同的数据，请使用服务。

Here is an example

app.controller('test.views.detail', function($scope, detailsClicked) {

    $scope.detailsClicked = detailsClicked;

    $scope.showDetails = function(item){
        $scope.detailsClicked.isClicked = true;
    }
});

创建一个工厂/服务来保留数据，确保数据是一个

app.factory('detailsClicked', function(){
  var data = {
    isClicked: false
  }

  return data;
});

【讨论】：