javascript - Cannot pass boolean to directive with Angular -


i'm trying pass boolean value controller isolated scope directive. when console.log(attrs) directive's link function, someboolean attribute string, rendering actual text "main.bool" instead of true or false value. when toggle boolean value outer controller, want updated in directive.

https://plnkr.co/edit/80cvlkhfvljnfl6g7fg9?p=preview

app.directive('mydirective', function() {     return {       restrict: 'e',       replace: true,       scope: {         someboolean: '='       },       templateurl: 'mydirective.html',       link: function(scope, element, attrs) {         console.log(scope);         console.log(attrs);       },       controller: function($scope, $element, $attrs) {         console.log(this);       },       controlleras: 'directivectrl',       bindtocontroller: true     };   }); 

controller

   app.controller('mainctrl', function($scope) {       var vm = this;        vm.bool = true;       vm.change = function() {         vm.bool = !vm.bool;       }     }); 

the template

<div>   inside directive: {{someboolean}} </div> 

as have attached directive controller directivectrl instead of mainctrl, you'll access variable someboolean using directivectrl.someboolean.

in case, change html to:

<div>   inside directive: {{directivectrl.someboolean}} </div> 

plunker.

another solution remove bindtocontroller property inside directive. this, don't need use controller name before variable. working plunker.

read more bindtocontroller feature here.


Comments

Popular posts from this blog

authentication - Mongodb revoke acccess to connect test database -

r - Update two sets of radiobuttons reactively - shiny -

ios - Realm over CoreData should I use NSFetchedResultController or a Dictionary? -