Question

我有以下指令：

app.directive('markdown', function () {
    var converter = new Showdown.converter();
    return {
        restrict: 'E',
        link: function (scope, element, attrs) {
            var htmlText = converter.makeHtml(attrs.abc);
            element.html(htmlText);
        }
    }
});

哪个不正常，所以提出以下内容。

app.directive('markdown', function () {
        var converter = new Showdown.converter();
        return {
            restrict: 'E',
        scope: {
                    input: '=input'
                },
            link: function (scope, element, attrs) {
               scope.$watch(input,function(newvalue){
                 element.html(newvalue);
               });

            }
        }
    });

我称之为：

<markdown input="{{ q.qv.text }}"></markdown>

但它给了我一个错误：

Error: [$parse:syntax] http://errors.angularjs.org/1.2.2/$parse/syntax?p0=q.qv.text&p1=is%20unexpe…ting%20%5B%3A%5D&p2=4&p3=%7B%7B%20q.qv.text%20%7D%7D&p4=q.qv.text%20%7D%7D
    at Error (<anonymous>)
    at http://127.0.0.1:81/Scripts/angular-v1.2.2/angular.min.js:6:449
    at Wa.throwError (http://127.0.0.1:81/Scripts/angular-v1.2.2/angular.min.js:152:467)
    at Wa.consume (http://127.0.0.1:81/Scripts/angular-v1.2.2/angular.min.js:153:454)
    at Wa.object (http://127.0.0.1:81/Scripts/angular-v1.2.2/angular.min.js:161:138)
    at Wa.primary (http://127.0.0.1:81/Scripts/angular-v1.2.2/angular.min.js:152:102)
    at Wa.unary (http://127.0.0.1:81/Scripts/angular-v1.2.2/angular.min.js:158:371)
    at Wa.multiplicative (http://127.0.0.1:81/Scripts/angular-v1.2.2/angular.min.js:158:104)
    at Wa.additive (http://127.0.0.1:81/Scripts/angular-v1.2.2/angular.min.js:157:466)
    at Wa.relational (http://127.0.0.1:81/Scripts/angular-v1.2.2/angular.min.js:157:330)

当我点击链接时说：

Syntax Error: Token 'q.qv.text' is unexpected, expecting [:] at column 4 of the expression [{{ q.qv.text }}] starting at [q.qv.text }}].

Answer 1

恕我直言，你应该使用。

 <markdown input="q.qv.text"></markdown>

您不需要{{}}

根据评论使用。 这给出了一个新的错误“ReferenceError：input is not defined”指向“scope。$ watch（input，function（newvalue）{”

scope.$watch(function(){
  return scope.input;
},function(newvalue){
 element.html(newvalue);
});

修改

完整指令代码

app.directive('markdown', function () {
    return {
        restrict: 'E',
        scope: {
            input: '=input'
        },
        link: function (scope, element, attrs) {
            scope.$watch(function () {
                return scope.input;
            }, function (newvalue) {
                element.html(+newvalue * 6); 
            });
        }
    }
});

用法

 <markdown input="myVar"></markdown>

Plunker DEMO

在AngularJS中调用指令时出错

1 个答案:

修改