How to apply/prevent overwriting/overriding css/style using javascript/angularJs?

Question

I am new to angularJs. there is a requirement need to assign css property to component at/from js file level. I have kept debugger, after assign css style to component. In debugger level I can able to see all applied css property to component behavior will be good. Once completes page load, I am not able to see applied css, from js file. From my side may be some overwriting/removing css style. How to achieve this one using angular/JavaScript/J query, great appreciate.

Here is my code.

By AngularJS

angular.element.find('.ctp-textfield')[0].style.width = "75px !important";
angular.element.find('.ctp-textfield')[0]["ng-style"] = "{height: 75px}";

By JavaScript

document.getElementById('Idname').style.width = "75px !important";

By JQuery

$('#idname')[0].style.width = "75px !important";
$('#idname').style.width = "75px !important";

Use the ng-class directive

urbz
– urbz

2014-07-31 07:14:04 +00:00
Commented Jul 31, 2014 at 7:14 — urbz
– urbz, Commented Jul 31, 2014 at 7:14

craigb · Accepted Answer · 2014-07-31 07:08:04Z

0

The way to do DOM manipulation in Angular is to use a directive. All of the above snippets of code look like they are not running inside the link function of a directive so will not work as you expect (but theres not enough context to tell what you're doing).

see:

answered Jul 31, 2014 at 7:08

craigb

16.9k7 gold badges54 silver badges63 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to apply/prevent overwriting/overriding css/style using javascript/angularJs?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related