Access vm property in AngularJS directive with ControllerAs inside controller -
in question got this answer. (demo: http://plnkr.co/edit/lyg15xpb3csbqgib37ya?p=preview)
the source this:
var app = angular.module('plunker', []); app.controller('mainctrl', function($scope, $timeout) { this.scenarios = [] $timeout(function() { this.scenarios.push({name: 21}); }.bind(this), 1000); }); mydirectivecontroller.$inject = []; function mydirectivecontroller() { var vm = this; // code of question... } app.directive('mydirective', function() { return { restrict: 'e', template: '<div>{{vm.scenarios[0].name}}</div>', scope: { scenarios: '=' }, controller: mydirectivecontroller, controlleras: 'vm', bindtocontroller: true, replace: true } });
html:
<body ng-controller="mainctrl vm"> {{vm.scenarios}} <my-directive scenarios="vm.scenarios"></my-directive> </body>
my question is, how can access vm.scenarios in controller?
var vm = this; console.log(vm.scenarios); // returns []
when log this:
var vm = this; console.log(vm);
it returns object { scenarios: array[0] }
, when inspect in browser, scenarios
contains value expected because has been updated after timeout of 1 second.
but need map scenarios
inside controller when they're bound scenario
property:
vm.myscenarios = vm.scenarios.map(function(scenario) { // .... })
how can this? should watch vm.scenarios
changes?
Comments
Post a Comment