javascript - Is it possible to pass a boolean to a directive and trigger something if that boolean changes without $watch? -
i hoping able similar following simplified example:
class buttoncontroller { set isfoo(value) { console.log(value); // here } } angular.module('myapp', []).directive('mbutton', () => { return { restrict: 'e', replace: true, controller: buttoncontroller, controlleras: 'button', template: '<button class="btn" type="button">blah</button>', scope: {}, bindtocontroller: { isfoo: '=' } }; }); and call directive like:
<div ng-app="myapp"> <m-button is-foo="true"></m-button> </div> preview: http://codepen.io/anon/pen/zrwrvr?editors=1010
however, generates $compile:nonassign error fix, this:
<div ng-app="myapp" ng-init="foo=true"> <m-button is-foo="foo"></m-button> </div> preview: http://codepen.io/anon/pen/vexwem?editors=1010
but want able pass boolean directly shown in previous markup. not possible? need following if want pass boolean directly?
class buttoncontroller { set isfoowatcher(value) { console.log(value); // here } } angular.module('myapp', []).directive('mbutton', () => { return { restrict: 'e', replace: true, controller: buttoncontroller, controlleras: 'button', template: '<button class="btn" type="button">blah</button>', scope: {}, bindtocontroller: { isfoo: '=' }, link(scope, element, attrs, ctrl) { scope.$watch(() => ctrl.isfoo, () => { ctrl.isfoowatcher = ctrl.isfoo; }); } }; });
randomly figured out today... problem had setter property not getter! following works:
class buttoncontroller { set isfoo(value) { console.log(value); this._isfoo = value; } isfoo() { return this._isfoo; } } angular.module('myapp', []).directive('mbutton', () => { return { restrict: 'e', replace: true, controller: buttoncontroller, controlleras: 'button', template: '<button class="btn" type="button">blah</button>', scope: {}, bindtocontroller: { isfoo: '=' } }; }); working example: http://codepen.io/anon/pen/rxrzwe?editors=1010
Comments
Post a Comment