Tuesday 15 April 2014

angularjs - How to access scope outside of ng-repeat in a directive -



angularjs - How to access scope outside of ng-repeat in a directive -

i have angular directive , list of items:

<li ng-repeat="x in topics"> <p change-content-on-click>{{ x.name }}</p> </li> app.directive('changecontentonclick', function(topicservice) { return{ restrict: 'a', link: function(scope, element) { element.bind('click', function(){ scope.message = "hello"; scope.$apply(); }); } } });

what need bind {{ message }} outside repeat clicked item in list. how can that? went through lot of documentation couldn't find.

pass in attribute 2 way info binding

<li ng-repeat="x in topics"> <p change-content-on-click some-attr="message">{{ x.name }}</p> </li> <div ng-bind='message'></div> <!-- same {{message}} less messy on failure -->

js:

$scope.message = {text:""}; app.directive('changecontentonclick', function() { return{ restrict: 'a', scope: { someattr: "=" }, link: function(scope, element) { element.bind('click', function(){ scope.message = "hello"; scope.someattr.text = scope.message; scope.$apply(); // not sure need console.log(scope.message); }); } } });

updated: fixed according below comments, you're right, forgot cant assign string, need object.

http://plnkr.co/edit/1qtlzk41jzrwiglrizg9?p=preview

angularjs

No comments:

Post a Comment