Question

当我尝试评估下面的json表单时，它会给我一个错误 -

eval("{form: 'form' , nameToMatch: 'password1'}")

为什么上述表格无效？

但是以下工作正常 -

eval("{form: 'form'}")

我试图将上面的json作为字符串传递，作为指令的param输入。

下面是html -

<input type="password" name="password2" ng-model="user.confirmPassword" placeholder="Confirm Password" match="{form: 'form', nameToMatch: 'password1'}" required="required"/>

谢谢，穆尔塔扎

Answer 1

将parens放在你的json周围：

 eval("({form: 'form' , nameToMatch: 'password1'})")

虽然看起来不是一个有角度的问题。不确定你要做什么：

无论如何，要将传递 json到指令，有很多方法可以做到这一点。我不确定你为什么要那样做而不只是传递一个物体。

传递json可以通过很多方式完成......

从您的属性对象：

app.directive('foo', function () {
   return function(scope, element, attrs) {
       var obj = eval('(' + attrs.foo + ')');
   };
});

，其中

<div foo="{'test':'wee'}"></div>

来自孤立的范围：

app.directive('foo', function () {
   return {
     restrict: 'E',
     scope: {
      'jsonIn' : '@'
     },
     link: function(scope, element, attrs) {
       var obj = eval('(' + scope.jsonIn + ')');
     };
   };
});

，其中

<foo json-in="{'test':'wee'}"></foo>

但如果可以的话，最好不要不惜一切代价避免使用原生eval。在几乎所有情况下你都可以。如果你有一些数据只是把它放在一个范围参数的对象上，并通过隔离范围内的双向属性或名称传递它，并在其上做一个角度$ eval。

编辑：传递对象...

您可以在隔离范围上使用双向绑定：

app.directive('foo', function (){
  return {
     restrict: 'E',
     scope: {
        'data' : '='
     },
     link: function(scope, elem, attrs) {
        console.log(scope.data);
     }
  };
});

，其中

<foo data="{ test: 'wee' }"></foo>

以这种方式做这件事真的很酷，如果你使用的是scoped属性，它会双向更新：

app.controller('MainCtrl', function($scope) {
    $scope.bar = { id: 123, name: 'Bob' };
});

，其中

<foo data="bar"></foo>

我希望有所帮助。

Answer 2

看起来您正在尝试确认表单中的密码。有很多方法可以解决这个问题，而不需要使用JSON来传递AngularJS中的值。我在网上找到的最有用的资源来自这个Google Group主题：

1）http://jsfiddle.net/pkozlowski_opensource/GcxuT/23/将进行比较   具有第一个字段的 model 值的第二个字段中的值

2）   http://jsfiddle.net/S8TYF/会比较第二个字段中的值   输入第一个字段的值

差异可能很微妙，但却有实际后果：   （2）一旦开始输入，确认验证将立即启动   第一个领域的任何事情。用（1）确认验证   只有在第一个字段有效后才能启动。在电子邮件中确认   例如，这意味着您不会开始显示确认错误，直到   电子邮件验证错误被整理出来（因此用户可以专注于一个   当时的错误。）

来源：https://groups.google.com/d/msg/angular/R4QeNsNksdY/migbplv8GxIJ

从first link开始，指令使用如下：

<label>e-mail</label>
<input name="email" type="email" required ng-model="email">  

<label>repeat e-mail</label>
<input name="emailRepeat" type="email" required 
       ng-model="emailRepeat" 
       ui-validate-equals="email">

ui-validate-equals指令指向第一个输入中定义的email模型。

如果您希望了解其他有关解决问题的建议，请参阅StackOverflow answers。

Answer 3

See also。 @Blesh已经顺便提到了，但没有强调：Angular为您提供了eval()的安全版本，如果你没有＆＃，它非常适合将声明性对象/数组传递给你的指令39;我想在你的范围内声明它们，并且明智地不想使用原生eval()。在OP的例子中，只需在指令中使用它：

angular.$eval(attrs.match);

Answer 4

虽然看起来不是一个有角度的问题。

同意 - 香草JS可以处理这个问题。

// Markup (HTML)
<div mydirective='{"test1": "foo", "test2": "bar"}'></div>

// App (JS)
JSON.parse(attrs['mydirective']);

Answer 5

在角度中使用JSON.parse（string）。确保您的参数是字符串格式。

如何将json作为字符串参数传递给指令

5 个答案: