angularjs - Retrieving a value from a function in ngStyle -
i beginner in angularjs , sure there must easy solution can't pin it. trying style element through function, unsucessfully. here code:
script.js: (function(angular) { 'use strict'; angular.module('docsbindexample', []) .controller('controller', ['$scope', function($scope) { $scope.color = "{'background-color':'red'}"; $scope.fetchstyle = function(){ return {'background-color':'red'}; }; $scope.name = 'max karl ernst ludwig planck (april 23, 1858 – october 4, 1947)'; }]); })(window.angular); index.html: <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>example - example-example9-production</title> <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.min.js"></script> <script src="script.js"></script> </head> <body ng-app="docsbindexample"> <div ng-controller="controller"> hello <input ng-model='name'> <hr/> <span ng-bind="name" ng-style="fetchcolor()"></span> <br/> <span ng:bind="name"></span> <br/> <span ng_bind="name"></span> <br/> <span data-ng-bind="name"></span> <br/> <span x-ng-bind="name"></span> <br/> </div> </body> </html> i using fetchcolor() color span. there syntax mistake or else? responses appreciated.
ng-style needs expression. using fetchcolor() in markup have fetchstyle() in controller
try
<span ng-bind="name" ng-style="{{fetchstyle()}}"></span> <br/> <span ng:bind="name" ng-style="{{color}}"></span> <br/> in addition creating string $scope.color
change:
$scope.color = "{'background-color':'red'}"; to
$scope.color = {'background-color':'red'}; 
Comments
Post a Comment