Question

我对角度很新，我正在研究如何在我的应用程序中使用模态的POC。这就是我在做的事情：

我有控制器在范围内声明一个名为open的函数。 open函数将url作为输入。现在，我需要传递的url是动态创建的：

<a ng-click="open(/test/obj['test-attr']/update/)" href="/test/{{ obj['test-attr'] }}/update/">{{ obj['test-attr'] }}</a>

但是这给了我一个解析错误。我不知道如何将数据传递给控制器。

更新

错误不是因为引用而是因为/。是否有一种角度方式将特殊字符传递给函数。

这是我得到的错误：

Error: [$parse:lexerr] http://errors.angularjs.org/1.2.22/$parse/lexerr?p0=Unexpected%20nextharacter%20&p1=s%205-5%20%5B%5C%5D&p2=open(%5C

Answer 1

通过传递特殊字符无法解决您的问题。你被误导了。

ng-click中的表达式有语法错误。永远记住这就像＆＃34; javascript代码＆＃34; （或者＆＃34; javascript表达式＆＃34;更准确地说）。我的意思是，你会在javascript中输入以下内容吗？

open(/test/obj['test-attr']/update/)

...这不会在javascript中飞行。 /test/和/update/是字符串文字，应该引用。要连接所有这些字符串，请使用旧的+（加号）符号。总结一下，它应该看起来像：

open('/test/' + obj['test-attr'] + '/update/')

这里有良好的语法（和一个有效的Plunker）：

<a ng-click="open('/test/' + obj['test-attr'] + '/update/')" 
    href="/test/{{ obj['test-attr'] }}/update/">{{ obj['test-attr'] }}
</a>

http://plnkr.co/edit/uctqC5ByrR0wMvYUI5nX

潜在的第二个问题：以下是 Off-Topic ，但与Plunker中的代码有关。它并没有真正回答原始问题，但这是我在测试Plunker示例时遇到的一个问题。

Angular Expressions中的window.open（）无法直接使用。

这些表达并不完全是＆＃34; Javascript＆＃34;，而是＆＃34; AngularJS Expressions＆＃34;。

似乎代码试图调用＆＃34; open（）＆＃34; （全局javascript对象 - ＆＃34; AngularJS Expressions＆＃34;中无法访问的内容）。 Angular对全球可访问的内容保持非常严格的控制。

我的意思是，你只能在这些表达式中真正访问$ scope中的内容。因此，我创建了一个＆＃34; open＆＃34; $ scope中只调用$ window.open（）的方法。（$ window是AngularJS包装器＆＃34;窗口＆＃34;用于单元测试/模拟，这是调用全局javascript函数的Angular方式。）

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope, $window) {
  $scope.obj = { "test-attr": "testAttrData" };
  $scope.open = function() { $window.open.apply(null, arguments); }
});

我还怀疑您可能会遇到第三个问题：open()会被调用，但这不会阻止href操作重新加载页面的正常效果。如果是这种情况，只需在$event.preventDefault();表达式中添加ng-click：

ng-click="open('/test/' + obj['test-attr'] + '/update/'); $event.preventDefault();"

如何在函数中传递特殊字符

1 个答案: