Question

这是一个角度1的应用程序。我的指令看起来像这样：

function addLiquidity() {
  return {
    restrict: 'E',
    scope: {
      expanded: '='
    },
    templateUrl: 'liquidity.html',
    controller: 'addLiquidityCtrl'
  };
}

看起来像这样的html：

<add-excess-liquidity expanded="addExpanded"></add-excess-liquidity>

在另一个HTML中我有这个：

展开：{expanded}

默认情况下这是假的，这要归功于控制器在其相关部分中包含：

$scope.addExpanded = false;

现在，当点击按钮显示表单以添加新内容时，＆＃34; addExpanded＆＃34;设置为true。然后单击实际保存表单的按钮＆＃34; addExpanded＆＃34;再次设置为false：

$scope.addExpanded = false;

我可以在控制器中看到调用该函数，并且addExpanded在控制器中正常运行。

实际上，它在视图中也表现正常。所以html中的值：

expanded: {expanded}

反映了控制器中的值。

然而，一旦我切换到另一个标签（此应用程序使用nav-tabs）并返回到我之前的标签，那么html中的值不再反映控制器（它仍在执行其工作像以前一样，经历与以前相同的步骤，包括将＆＃34;扩展＆＃34;设置为假。）

我尝试使用超时和＆＃34; apply＆＃34;强制进行视图更新。但没有帮助。此外，似乎在每个函数结束时都会触发一个应用程序。我真的不明白这里有什么不对。我应该在哪里看？第一次离开标签时会发生一些事情（我猜）。但是有很多事情发生，因此调试起来并不容易。任何人都有任何线索？

修改

我添加了这样的手表：

$scope.$watch( 'addExpanded',
    function(newValue, oldValue){
        console.log('addExpanded Changed');
        console.log(newValue);
        console.log(oldValue);
    }
);

我第一次去标签然后它会打印到控制台。然后我离开标签，然后回到它。而这一次，当点击按钮时，控制台上没有任何内容。

粗略地说，当我更改标签时会发生的事情是包含标签内容的div设置为＆＃34; display：none / block＆＃34; （我猜）因为纯粹的css在选择时会显示标签内容。

在主控制器中，根据选择的选项卡进行了一些操作，但我看不到会破坏＆＃34;＆＃34; GUI与控制器/指令之间的连接。

此外，每次我去那个标签时，我都会看到连接到该指令的javascript正在启动。变量＆＃34;扩展＆＃34;重置为false。

问题是，由于某种原因，javascript和GUI之间的连接在某种程度上是“失败的”＃34;第二次访问选项卡时（直到我刷新页面的所有未来）。

角度视图不反映控制器

0 个答案: