Question

我想在服务中创建一个新元素，编译它并将其附加到正文（消息框）。我的问题是，是否以及如何在服务中创建新元素并将其附加到DOM，以及是否有更好的方法可以（它应该在服务中）。< / p>

我的问题是我无法将属性绑定到指令的范围：

我收到了以下代码：

在我的服务中创建新元素的方法

_createMessageBox = function (text, buttons) {
    var msgBox = document.createElement('message-box');
    msgBox.setAttribute('class', 'messageBox');
    msgBox.setAttribute('text', text);
    msgBox.setAttribute('buttons', buttons);
    $compile(msgBox)(scope);
    $('body').append(msgBox);               
};

使用服务

var buttons = ['Eins', 'Zwei'];
mbs.createMessageBox('Nachricht', buttons);

指令

app.directive('messageBox', function () {
    link = function (scope, element, attrs) {
        scope.buttonClicked = function(id) {
            this.$emit('button'+id+'_clicked');
        }
    }

    return {
        restrict: 'E',
        scope:
        {
            text: '=',
            buttons: '='
        },
        link: link
        };
});

当我这样做时，我收到此错误且属性未被绑定

错误：[$ parse：syntax]语法错误：令牌＆＃39;，＆＃39;是[Eins，Zwei]从[，Zwei]开始的第5列的意外标记。

Answer 1

您依赖指令和服务，因此您应该使用提供商而不是此引用的服务http://docs.angularjs.org/guide/providers

其次你的指令有一个独立的范围，所以即使你在控制器级别执行事件，你也无法根据你在评论部分的要求从指令做出响应，我会建议你在{{3中使用$ modal服务}}

Answer 2

我找到了解决问题的方法，

msgBox.setAttribute('text', text);
msgBox.setAttribute('buttons', buttons);

这只是将属性设置为常量字符串，解决方案是为我创建元素的范围创建属性加上我必须将字符串作为属性而不是变量

此代码正常运行：

_createMessageBox = function (text, buttons) {
    scope.text = text;
    scope.buttons = buttons;
    var msgBox = document.createElement('ext-message-box');
    msgBox.setAttribute('class', 'extMessageBox');
    msgBox.setAttribute('text', 'text');
    msgBox.setAttribute('buttons', 'buttons');
    $compile(msgBox)(scope);
    $('body').append(msgBox);               
};

带Service的Angular create指令

2 个答案: