Javascript 调试错误时遇到困难-令牌';{';第2列的键无效
我遇到了一个无法调试的错误 form-field.htmlJavascript 调试错误时遇到困难-令牌';{';第2列的键无效,javascript,angularjs,angularjs-directive,angularjs-scope,Javascript,Angularjs,Angularjs Directive,Angularjs Scope,我遇到了一个无法调试的错误 form-field.html <div class='row form-group' ng-form="{{field}}" ng-class="{ 'has-error': {{field}}.$dirty && {{field}}.$invalid }"> <label class='col-sm-2 control-label'> {{ field | labelCase }} <span ng-if='r
<div class='row form-group' ng-form="{{field}}" ng-class="{ 'has-error': {{field}}.$dirty && {{field}}.$invalid }">
<label class='col-sm-2 control-label'> {{ field | labelCase }} <span ng-if='required'>*</span></label>
<div class='col-sm-6' ng-switch='required'>
<input ng-switch-when='true' ng-model='record[field][0]' type='{{record[field][1]}}' class='form-control' required ng-change='update()' ng-blur='blurUpdate()' />
<div class='input-group' ng-switch-default>
<input ng-model='record[field][0]' type='{{record[field][1]}}' class='form-control' ng-change='update()' ng-blur='blurUpdate()' />
<span class='input-group-btn'>
<button class='btn btn-default' ng-click='remove(field)'><span class='glyphicon glyphicon-remove-circle'></span></button>
</span>
</div>
</div>
<div class='col-sm-4 has-error' ng-show='{{field}}.$dirty && {{field}}.$invalid' ng-messages='{{field}}.$error'>
<p class='control-label' ng-message='required'> {{ field | labelCase }} is required. </p>
<p class='control-label' ng-repeat='(k, v) in types' ng-message='{{k}}'> {{ field | labelCase }} {{v[1]}}</p>
</div>
</div>
{{field | labelCase}}*
{{field | labelCase}}是必需的
新联系人
建立联系
我得到以下错误:
在浏览器中:
错误:[$parse:语法]
$parse/syntax?p0=%7B&p1=无效的%20键&p2=2&p3=%7B%7B字段%7D%7D。%24错误&p4=%7B字段%7D%7D。%24错误
现场:
错误:$parse:语法错误:标记“{”无效键
在表达式[{field}.$error]的第2列,从
[{field}.$error]
有人知道为什么吗?谢谢!你的问题在这里:
ng-class="{ 'has-error': {{field}}.$dirty && {{field}}.$invalid }"
删除{{}
:
ng-class="{ 'has-error': field.$dirty && field.$invalid }"
这里也有同样的问题:
ng-messages='{{field}}.$error'
替换为:
ng-messages='field.$error'
但是,修复这些问题很可能也会导致此行出错:
ng-message='{{k}}'
因此,您必须将其更改为:
ng-message='k'
我注意到,将数据绑定到自定义指令上的属性时也会发生此错误
$scope.myData.value = "Hello!";
这会导致以下错误:
<my-custom-directive my-attr="{{myData.value}}"></my-custom-directive>
但这很好:
<my-custom-directive my-attr="myData.value"></my-custom-directive>
当我学习同一教程时,这个问题发生在我身上,我发现我的解决方案是使用了更新版本的ngMessages,因此我必须用视频中的相同版本更新我的bower.json文件(从版本1.4开始,示例不起作用),那么一切都很好,下面是我的依赖项部分:
"dependencies": {
"angular": "1.3.9",
"angular-route": "1.3.9",
"angular-resource": "1.3.9",
"angular-messages": "1.3.9",
"bootstrap": "^3.3.6"}
这是我的html
<div ng-controller='MyCtrl' ng-init="array=[{id:1}, {id:2}]">Hi, it's {{name}}.
<div ng-repeat='obj in array'>
The current time is <display-time data="{{array}}"/>.
</div>
</div>
仔细观察data=“{{array}}”
所使用的语法
因为我在自定义指令的范围内使用数据
(与语句一起使用
scope: {
data: '='
},
),
我将得到解析错误
但是如果我使用语法data=“array”
,并且在link函数中使用以下代码片段
scope: {
//data: '='
},
然后我将不会得到一个解析错误
因此,只有当您想作为
link
函数中的attrs
参数的一部分访问它时,才应该使用语法data=“{{array}”
。您需要更新{{field}在ng类和ng-show.Nikhil中引用时指向字段-在这个项目中对它们很好:但对我来说不行。ng-show属性中不应该有{{}。请尝试使用“field.$dirty”
取而代之。顺便说一句:这只是与你的问题无关,但如果你将你的项目链接到未统一的角度源,你会在浏览器中看到可读的错误消息,而不是那些恼人的URL废话。(我花了一年半的时间才发现…)只是别忘了在部署之前切换回缩微版本!谢谢你的建议Daniel,关于缩微版本我不知道。现在我可以更容易地找到我的问题了,谢谢!你的回答是一个很好的提示。顺便问一下,有没有一个免费的好的调试器可以插入google Chrome来捕捉错误?我是一个angularJs newbie.'field'是一个范围变量。我想用该范围变量更新html。如果我们删除{{},那么'field'无法反映在html页面中。有解决方案吗?
scope: {
//data: '='
},