Question

我有一个指令，它具有与属性的双向绑定。我想在链接功能中重新分配属性。但是，这打破了参考。

这样做的正确方法是什么？

<div ng-app="zippyModule">
    <div ng-controller="Ctrl3">Title:
        <input ng-model="title">
        <div class="zippy" zippy-title="obj">{{obj.a}}</div>
    </div>
</div>

使用Javascript：

function Ctrl3($scope) {
    $scope.obj = {
        a: "a",
        b: "b"
    };
}

angular.module('zippyModule', [])
    .directive('zippy', function () {
    return {
        scope: {
            title: '=zippyTitle'
        },
        link: function (scope, element, attrs) {
            title = {
                a: "C",
                b: "D"
            };
        }
    };
});

http://jsfiddle.net/6HcGS/617/

Answer 1

试试这个：

<强> HTML

<div ng-app="zippyModule">
    <div ng-controller="Ctrl3">Title:
        <input ng-model="title.a">
        <div zippy="" zippy-title="title"></div>
            {{title.a}}
    </div>
</div>

<强>脚本

function Ctrl3($scope) {
    $scope.title = {
        a: "a",
        b: "b"
    };
}

angular.module('zippyModule', [])
    .directive('zippy', function () {
    return {
        scope: {
            zippyTitle: '='
        },
        link: function (scope, element, attrs) {
            scope.zippyTitle.a = 'Test Title';
        }
    };
});

http://jsfiddle.net/6HcGS/619/

Answer 2

这里有一些问题。

1）关闭您的输入：<input ng-model="title">

2）你的模块应该只有restrict才能明确，通常你会使用模板来获取你的去向。这就是说你已经设置了一个孤立的范围，变量名为title，然后你调用obj这个范围内不存在的范围。

angular.module('zippyModule', [])
.directive('zippy', function () {
return {
    restrict: 'A',
    scope: {
        title: '=zippyTitle'
    },
    template: 'TEMPLATE = {{title}}',
    link: function (scope, element, attrs) {
        scope.title = {
            a: "C",
            b: "D"
        };
    }
  };
});

3）你的指令错误，它应该是<div zippy ....而不是一个类。

分叉小提琴乐趣。注意我只是留下了一些东西。

http://jsfiddle.net/RomanKolo/j88CG/

编辑::如果设置restrict: 'C'

，您可以使用类

Answer 3

你需要：

link: function (scope, element, attrs) {
        scope.title = {
            a: "C",
            b: "D"
        };
    }

注意scope.title thingy，如果你不这样做＆＃34; title＆＃34;只是一个全局对象，在范围内没有引用标题对象。

AngularJs指令双向绑定：如何保留引用？

3 个答案: