将URN传递给参数时,AngularJS会引发错误

时间:2014-11-18 11:28:18

标签: javascript angularjs ionic-framework

在我的AngularJS / Ionic应用程序中,我编写了一个带有包含JSON Schema URN的元素的自定义参数的指令。问题是AngularJS尝试将此URN评估为表达式。

<myDirective myAttr="urn:jsonschema:net:example:net:myschema"></myDirective>

错误:

Error: [$parse:syntax] http://errors.angularjs.org/1.2.25/$parse/syntax?p0=%3A&p1=is%20an%20unexpected%20token&p2=4&p3=urn%3Ajsonschema%3Anet%3Aexample%3Anet%3Amyschema&p4=%3Ajsonschema%3Anet%3Aexample%3Anet%3Amyschema
    at Error (native)
    at http://localhost:8000/app/www/lib/ionic/js/ionic.bundle.min.js:37:450
    at fb.throwError (http://localhost:8000/app/www/lib/ionic/js/ionic.bundle.min.js:200:227)
    at fb.parse (http://localhost:8000/app/www/lib/ionic/js/ionic.bundle.min.js:199:82)
    at $get (http://localhost:8000/app/www/lib/ionic/js/ionic.bundle.min.js:130:31)
    at h (http://localhost:8000/app/www/lib/ionic/js/ionic.bundle.min.js:136:163)
    at k.$get.k.$watch (http://localhost:8000/app/www/lib/ionic/js/ionic.bundle.min.js:137:444)
    at linker (http://localhost:8000/app/www/js/directives.js:8:15)
    at http://localhost:8000/app/www/lib/ionic/js/ionic.bundle.min.js:95:293
    at N (http://localhost:8000/app/www/lib/ionic/js/ionic.bundle.min.js:85:372) <jsonform schema="urn:jsonschema:net:example:net:myschema"> ionic.bundle.min.js:123(anonymous function) ionic.bundle.min.js:123$get ionic.bundle.min.js:99N ionic.bundle.min.js:85g ionic.bundle.min.js:78g ionic.bundle.min.js:78N ionic.bundle.min.js:85g ionic.bundle.min.js:78N ionic.bundle.min.js:85g ionic.bundle.min.js:78(anonymous function) ionic.bundle.min.js:77d ionic.bundle.min.js:345u.directive.a.compile ionic.bundle.min.js:345N ionic.bundle.min.js:85g ionic.bundle.min.js:78N ionic.bundle.min.js:85g ionic.bundle.min.js:78N ionic.bundle.min.js:85g ionic.bundle.min.js:78(anonymous function) ionic.bundle.min.js:77d ionic.bundle.min.js:345u.directive.a.compile.b ionic.bundle.min.js:345$get.k.$broadcast ionic.bundle.min.js:145v.transitionTo.v.transition.N.then.v.transition.v.transition ionic.bundle.min.js:321l.promise.then.E ionic.bundle.min.js:131(anonymous function) ionic.bundle.min.js:132$get.k.$eval ionic.bundle.min.js:143$get.k.$digest ionic.bundle.min.js:140$get.k.$apply ionic.bundle.min.js:143h ionic.bundle.min.js:103u ionic.bundle.min.js:108w.onreadystatechange ionic.bundle.min.js:110XMLHttpRequest.send (async)b ionic.bundle.min.js:110s ionic.bundle.min.js:105$get.f ionic.bundle.min.js:102l.promise.then.E ionic.bundle.min.js:131l.promise.then.E ionic.bundle.min.js:131(anonymous function) ionic.bundle.min.js:132$get.k.$eval ionic.bundle.min.js:143$get.k.$digest ionic.bundle.min.js:140$get.k.$apply ionic.bundle.min.js:143(anonymous function) ionic.bundle.min.js:49d ionic.bundle.min.js:66c ionic.bundle.min.js:49fc ionic.bundle.min.js:49Xc ionic.bundle.min.js:48(anonymous function) ionic.bundle.min.js:245a ionic.bundle.min.js:176(anonymous function) ionic.bundle.min.js:62r ionic.bundle.min.js:38c ionic.bundle.min.js:62

如何阻止AngularJS解析我的属性?

修改:将架构的属性名称更改为 myAttr ,因为架构已保留。导致同样的错误。

1 个答案:

答案 0 :(得分:1)

使用text @ binding:

app.directive('myDirective', function () {
    return {
      restrict: 'E',
      scope: {
          myAttr: "@"
       },
       link: function (scope) {
          console.log(scope.myAttr);
        }
      };
    }
);

HTML:

<my-directive my-attr="urn:jsonschema:net:example:net:myschema"></my-directive>

plunker:http://plnkr.co/edit/xfh3MVWzhBrw7bpJsZ2B?p=preview