我的主要范围内有一个变量:
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>
多数民众赞成
答案 0 :(得分:3)
在你的html中,应该添加trigger属性:
<ns-modal trigger="trigger"/>
请注意,触发器可能是任何变量(但您在主范围内写过它被称为触发器)。
这是因为添加时:
scope:{
trigger: "="
},
创建指令的新范围。因此,您应该使用属性指定传递给指令的每个变量;
答案 1 :(得分:1)
您应该使用深度监视trigger
的变量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>
答案 2 :(得分:-1)
首先,你可能想要使用Angular的事件而不是$watch
- 因为它要贵得多。 (使用$scope.$broadcast & $scope.$on
)。
其次,如果您还可以指定如何使用该指令 - 这将有助于理解该问题。