Question

我遇到了与Passing variable to directive template without creating new scope类似的问题，这似乎对我没有帮助。代码看起来像;

.directive('billDir', function () {
    return {
        template: '<div><div draggable>hello {{msg}}</div></div>',
        link: function (scope, elem, attrs) {
            // scope.status = attrs.bill.getStatus();
            scope.msg = "world!";
        }
    }
})
.directive('draggable', function ($document) {
    return {
        scope: {
            bill: '='
        },
        replace: true,
        restrict: 'A',
        link: function (scope, element, attr) {
            // do something here
            var startX = 0,
                startY = 0,
                x = 0,
                y = 0,
                sourceX = 0,
                sourceY = 0,
                windowWidth = 0;

            element.on('mousedown', function (event) {
                event.preventDefault();
                startX = event.pageX - x;
                startY = event.pageY - y;
                $document.on('mousemove', mousemove);
                $document.on('mouseup', mouseup);
                windowWidth = $(window).width();
                sourceY = event.pageY;
                sourceX = event.pageX;
            }); // some more stuff, to the end of the directive

并且billDir没有按预期工作，我没有得到任何代替{{msg}}的信息

我在这里做错了什么？

Fiddle

Answer 1

深入研究你的代码，我发现你的指令标记有一个可以理解的错误。在通过指令创建HTML元素时，您必须添加 restrict：＆＃39; E＆＃39; 。

app.directive("billInfo", function() {
    return {
        restrict: 'E',
        replace: true,
        template: '<div><div draggable>hello {{msg}}</div></div>',
        link: function (scope, element, attrs) {
            scope.msg = "world! It Works!";
        }
    }
});

如果你没有声明一个限制：那么angular假定你希望指令表现为一个div的属性，例如<div bill-info></div>

这是小提琴的例子： http://jsfiddle.net/bebold/4b3NL/9/

AngularJS：链接问题，我如何使用标记？

1 个答案: