与Angular变量

时间:2016-03-01 09:14:20

标签: angularjs variables string-interpolation

我从服务器收到以下数据

{
    name: "Sam {{{{aaa}}}}"
}

在角度我使用以下内容将其打印出来

<span>{{name}}</span>

预期输出

<span>Sam {{{{aaa}}}}</span> <!-- I dont want the curly braces here to act as a variable -->

但它给我一个错误。似乎Angular也试图插入字符串name。我如何告诉Angular将其视为惰性字符串而不是变量?

我还研究了使用自定义Angular分隔符的选项,但是我很难在应用程序的其余部分更改它并导致更改。

使用ng-non-bindable的问题在于输出

<span>{{name}}</span> <!-- doesnt render this variable -->

但是我想渲染变量name并停在那里。但是角度试图将name内的东西渲染到。{1}}。即尝试渲染aaa但失败,因为它有4个大括号,即Lexer Error

这是我收到的数组中的一个对象ng-repeat

568cb34d9fd2ad1c1ef85632: Object
_id: "568cb34d9fd2ad1c1ef85632"
headline: "Android developer"
liprofile: "https://www.linkedin.com/xyz"
name: "First_nam Last_name {{{{user_role}}}}"
profilePicture: "https://media.licdn.com/mpr/mprx/0_t35SR8YAjvg3cAQG-L12Pt7Ajq78cKbPZ3jigzsAgqi3t8NaBLgSziqAOX1pNA4"
__proto__: Object

请注意,问题是由{{{{user_role}}}}

引起的

我使用angular 1.3.5

以下是我在日志中看到的错误

Error: [$parse:syntax] http://errors.angularjs.org/1.3.5/$parse/syntax?p0=%7B&p1=invalid%20key&p2=2&p3=%7B%7Buser_role&p4=%7Buser_role
    at Error (native)
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js:6:416
    at fb.throwError (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js:189:474)
    at fb.object (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js:199:132)
    at fb.primary (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js:189:87)
    at fb.unary (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js:196:279)
    at fb.multiplicative (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js:196:6)
    at fb.additive (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js:195:385)
    at fb.relational (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js:195:247)
    at fb.equality (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js:195:107)
    at fb.logicalAND (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js:194:487)
    at fb.logicalOR (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js:194:361)
    at fb.ternary (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js:194:116)

1 个答案:

答案 0 :(得分:0)

  

ngNonBindable

     

ngNonBindable指令告诉Angular不要编译或绑定当前DOM元素的内容。如果元素包含似乎是Angular指令和绑定但Angular应该忽略的内容,这将非常有用。例如,如果您的站点显示代码片段,则可能就是这种情况。

- AngularJS ng-non-bindable Directive API Reference