在隔离范围内观看，双向绑定不起作用答案

【问题标题】：Watch in isolated scope with two way binding not working在隔离范围内观看，双向绑定不起作用
【发布时间】：2015-04-22 08:54:13
【问题描述】：

我的主要作用域中有一个变量：

scope.trigger

在我的指令中：

angular.module('modal').directive('nsModal', ['nsTools', function (Tools) {
return {
    restrict: 'E',
    replace: true,
    scope:{
        trigger: "="
    },
    templateUrl: 'common/modal.html',
    controller: ['$scope', function (scope) {

        scope.isShown = false;

        scope.$watch(function () {
            return scope.trigger;
        }, function (n) {
            if (n == 'order-button') {
                scope.isShown = true;

            }
            else {
                scope.isShown = false;
            }
        });
        scope.clickClose = function ()
        {
            scope.currentTrigger = "";
        }
        scope.clickCancel = function ()
        {
            scope.currentTrigger = "";
            scope.isShown = false;
        }

        scope.clickYes = function ()
        {
            scope.currentTrigger = "";
            scope.isShown = false;
        }
    }]
}
}]);

我想更改 mainscope 触发器参数，所以我做了两种方式绑定。但是有了它，手表就不能工作了。手表中的 scope.trigger 始终未定义；

当我删除 scope 部分时，手表工作正常，但随后更改未保存在主范围中

html: 在我的索引中： <ns-modal /> 和模态代码：

<div ng-show="isShown">
    <div >
    <div class="modal">
        <div class="modalheader>
            <p >Message</p>
            <button ng-click="clickClose()"></button>
        </div>
        <div class="modal-body">
            <span>Identify customer ?</span>
            <div class="modalfooter">
                <button id="cancel" ng-click="clickCancel()">No</button>
                <button id="save" ng-click="clickYes()">Yes</button>
            </div>
        </div>
    </div>
</div>

就这些

【问题讨论】：

你能把指令放在你的html中吗？

标签： javascript angularjs

【解决方案1】：

在你的 html 中，应该添加 trigger 属性：

<ns-modal trigger="trigger"/>

请注意，触发器可能是任何变量（但您在主作用域中将其写为触发器）。

这是因为当它被添加时：

scope:{
    trigger: "="
},

为指令创建了一个新范围。因此，您应该使用属性指定传递给指令的每个变量；

【讨论】：

【解决方案2】：

您应该在变量 trigger 上使用 watch 和 deep watch true。

 scope.$watch('trigger', function (n) {
        if (n == 'order-button') {
            scope.isShown = true;

        }
        else {
            scope.isShown = false;
        }
    }, true);

更新

正如我在评论中所说，你的 html 应该有 trigger="someVariable"

标记

<ns-modal trigger="someVariable"></ns-modal>

【讨论】：

试过了，没触发。它没有看到触发器有任何变化
@szpic 你能添加你的 html 部分吗？在 html 上应该是 trigger="someVariable"

【解决方案3】：

首先，您可能想要使用 Angular 的事件而不是 $watch - 因为它要贵得多。（使用$scope.$broadcast & $scope.$on）。

其次，如果您还可以指定如何使用该指令 - 这将有助于理解问题。

【讨论】：