angularjs - Angular TypeError: name.replace is not a function for ng-style -
i'm new angular , keep getting following error in console typeerror: name.replace not function
. i'm not sure what's causing it, seems caused ng-style
statement , maybe camelcase?
the part don't understand why ng-style="isfrontview() || !matches && {'display': 'none'}"
throws error, ng-style="!isfrontview() || !matches && {'display': 'none'}"
doesn't throw error.
in attempt remedy situation tried removing camelcase function name , went lowercase. attempted use !!isfrontview()
, neither seemed remove error message.
do know cause of error message , potential fix?
html template:
<div class="system-view"> <div class="controller-container fill" id="systemview1" ng-style="isfrontview() || !matches && {'display': 'none'}"> <canvas id="canvaslayer-shell" data-layername="front" width="617" height="427"></canvas> <i ng-if="!matches" class="fa fa-repeat toggle-view" ng-click="changeview()" ng-touch="changeview()"></i> </div> <div class="controller-container fill" id="systemview2" ng-style="!isfrontview() || !matches && {'display': 'none'}"> <canvas id="canvaslayer-shell" data-layername="back" width="617" height="427"></canvas> <i ng-if="!matches" class="fa fa-undo toggle-view" ng-click="changeview()" ng-touch="changeview()"></i> </div> </div>
backend code:
$scope.frontview = true; $scope.matches = true; $scope.isfrontview = function() { return $scope.frontview; }; $scope.changeview = function() { $scope.frontview = !$scope.frontview; };
p.s. console error still functions normally.
your potential issue due incorrect usage of ng-style
. ng-style
sets watcher on expression , sets element's style of jquery/jqlite element.css
. , inside element.css
css attribute (name
) converted standard camel casing (which uses regex string replace). in specific case expression evaluated boolean (true
) instead of object (ng-style
each property) , boolean not have replace
property (which available on string object) , hence fails. can test converting expression evaluate string using string concatenation.
i.e ng-style="'' + (isfrontview() || !matches && {'display': 'none'})"
looking @ expression need hide , show element, make use of ng-show
/ng-hide
directives achieve that.
Comments
Post a Comment