angularjs ng-csp directive

angularjs example

Modify the "eval" behavior and inline style in angularjs:

<! Doctype html>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<body ng-app="" ng-csp>
<p>My first expression:{{5 + 5}}</p>
<p>With the ng-csp directive, you can modify the way angularjs executes code.
<p>angularjs execution improves performance by 30%</p>

operation result:

My first expression:10

Using the ng-csp directive, you can modify the way angularjs executes code.

angularjs execution improves performance by 30%

Definition and usage

The ng-csp directive is used to modify the security policy of angularjs.

If the ng-csp directive is used, angularjs will not execute the eval function, so inline styles cannot be injected.

Setting the ng-csp directive to no-unsafe-eval will prevent angularjs from executing the eval function, but allow inline style injection.

Setting the ng-csp directive to no-inline-style will prevent angularjs from injecting inline styles.But eval function is allowed.

The ng-csp directive is required if developing google chrome extensions or windows applications.

Note:The ng-csp directive will not affect javascript, but will modify the way angularjs works,This means:you can still write eval functions, and it works

Executes, but angularjs cannot execute its own eval function. If using compatibility mode,Reduces performance by 30%.


<element ng-csp="no-unsafe-eval | no-inline-style"></element>

Parameter value

value description


The value can be set to null,This means that neither eval nor inline styles are allowed.

You can set one of these values.

You can also set both values ​​separated by semicolons,But this has the same effect as leaving it blank.

  • Previous PHP + ajax login jump login implementation ideas
  • Next Ng-class instruction usage in AngularJS introductory tutorial