为什么我的 $watch 只触发一次？

Question

我正在分解一些小部件，$watch 表达式完美地工作在一个文件中，但现在我将相关的控制器部分移动到一个新的控制器中，并将标记移动到一个新的 html并且 $watch 在初始化后恰好触发一次，但在编辑相关输入时不会触发。

JS:

app.controller('getRecipientWidgetController', [ '$scope', function($scope) {
    console.log("controller initializing")
    var testReceivingAddress = function(input) {
        console.log("change detected")
    }
    $scope.$watch("addressInput", testReceivingAddress)
} ])

HTML 包装：

<ng-include
    src="'partials/getRecipientWidget.html'"
    ng-controller="getRecipientWidgetController"
    ng-init="recipient=cert"> <!-- ng-init doesn't influence the bug. -->
</ng-include>

HTML 共 partials/getRecipientWidget.html:

<md-text-float ng-model="addressInput"></md-text-float>

我怀疑有一些范围巫毒正在发生？我将 ng-init 留在其中以明确我想要实现的目标：构建一个明显更复杂、可重用的小部件，在这种情况下，它可以在 $scope.cert 上工作，因为它的 recipient.

Answer 1

这可能是因为 ng-include 将在包含的 HTML 上创建一个新的继承范围，因此您控制器中的 $scope.addressInput 与控制器中的 $scope.addressInput 不同getRecipientWidget.html

好吧，这不容易解释，但您应该将 ng-controller 放在 getRecipientWidget.html 的 HTML 中（而不是放在上面包含它的 div 中） , 或者您可以使用诸如 something.addressInput 之类的对象而不是原始 addressInput 这样可以避免原始类型 (number/string).

的引用问题

Answer 2

ng-include 创建新范围。

试试这个

<md-text-float ng-model="$parent.addressInput"></md-text-float>

Plunker example

为什么我的 $watch 只触发一次？

Why does my $watch only ever fire once?

javascript

angularjs

angularjs-ng-include